Question

In my .css, I’m using a fixed width, centered layout with:

#page-container {
width: 760px;
margin: auto;
padding-top: 10px;
}

All pages using the .css are the same width. If I insert bullet points into a div, it seems to move to the left by a few pixels and is no longer centered. This also happens if I insert an iframe.

Perhaps someone more experienced could suggest the cause?

[Edit]

It’s being caused by the scrollbar appearing as I add content. Is there anything I can do about this?

Answer 1

To keep the page from shifting, you should set the body style to overflow:scroll so there’s always a scrollbar.