Question

When I coded my website on my 18 inch screen, everything looks perfect! But, once I got over to my Mac (13 inch) everything just went big and the divs were crashing and everything looks extremly zoomed. I know this have something to do with sizing and the position, but I need further help.

One of the CSS it happens to are this code, is something wrong?

#client_play {
    position: relative;
    padding-top: 125px;
    padding-left: 560px;
    padding-bottom: 200px;
}

Link to page: like4fame.com/rsps/index.html

Link to my css: http://like4fame.com/rsps/css/css.css

Was it helpful?

Solution

A good starting point to resolving this issue is to remove the position: absolute, position: relative, and position: fixed styles in your code.

You also want to avoid using <center> and go with text-align: center or margin: 0 auto to center your text or div.

Removing all those styles from your code should help you achieve a better overall website fit for several screen sizes.

I also agree with jfriend00 above about reading about responsive web design.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top