A popular web design common today is the fixed-width center-aligned page with space on both sides. However, many web designers have been left puzzled and perplexed after designing a web page to see it shifting slightly back and forth as they browse through their site.
The cause? Not in the HTML or CSS code. It’s in the browser. Firefox and many other browsers (except Microsoft’s IE) hide the vertical scroll bar on short web pages, and show them in long pages. The difference of ~16 pixels is enough to irk many web designers when the design of the page realigns to accomodate the scroll bar on longer pages.
The solution is fairly simple; force the scroll bar to show on all pages:
html
{
min-height: 100%;
margin-bottom: 1px;
}