Question

I am designing a website. I want my website to be 980px width. I can easily do it on my laptop by setting the right and left fields of CSS Box as 15%. But my concern is that, when my website is opened on another PC with no widescreen, that 15% will create a distortion. I want to keep my website at 980px whatever be the screen size may be. Please help!

As you can see in the image attached. The boxes are 15% distance from sides. If screen will be shorter for a pc, then these boxes will overlap.

Answer 1

Rather than trying to explicitly set the left and right margins, just have it auto center.

<div style="width: 980px; margin: 0 auto; overflow: hidden;">
    <div style="float: left; width: 80%;">Left Column</div>
    <div style="float: right; width: 20%;">Right Column</div>
</div>

The key is the auto margin for left and right. This will horizontally align that 980px div in the center and keeping the width no matter what.