Long pages in FireFox offset when scrollbar appears

Question

In Firefox and Safari, pages that are centered move a few pixels when the page is long enough for the scrollbar to appear. If you navigate through a site that has long and

Answer 1

You could simply always enable the scrollbar:

html{
 overflow: scroll;
}

but that would give you the horizontal scrollbar too, this is better:

html{
   overflow-y:scroll;
   overflow-x:auto;
}

That will give you only the vertical scroll and the horizontal when needed.

Answer 2

This site contains a javascript to fix the problem which is a better solution IMO than the current one (a permanent scrollbar):

http://www.johnpezzetti.com/2011/01/31/removing-vertical-scrollbar-jump-shift-problem-a-javascript-fix-for-all-browsers

This script waits until the DOM is loaded then checks to see if a scrollbar is active. If it is, it calculates the width of the scrollbar and sets the body’s marginLeft equal to that width. This offsets the shift, and since it runs on DOM load it takes instant effect.