Question

…without using margin:0 auto;

Why? It causes pages with a scrollbar to have a different center position than those pages without scrollbar, so when navigating through pages, divs are jumping. What would you suggest, guys?

Answer 1

I’m afraid the “jumping” effect is unavoidable because the scrollbars affect the viewport width, which in turn affects the centreline of the page. This happens regardless of technique (text-align: center;, position: -50%;, etc).

The workaround is to force the vertical scrollbar to always appear. Use this:

html { overflow-y: scroll; }

From here, but you can disregard most of the samples on that page and jump to the bottom.

Note that overflow-x and overflow-y were originally Microsoft extensions on the CSS2.x standard overflow property. However both overflow-x and overflow-y are in CSS3.