Stop browser from resizing website when scrollbar is visible

Question

In Windows, when the scrollbar is visible it changes the width of the website and makes it appear to 'jump', yet in Mac OSX the scrollbar simply hovers over the website and doesn't change any sizing.

Is there any way to force the scrollbar in Windows to act the same?

Answer 1

I don't believe you can cause the scrollbar to overlay the site, but you can force it to always be visible by setting (demo):

body{
   overflow-y:scroll;
}

This is on the assumption it is your body element that requires scrolling, alternatively simply set it on the element representing the scrollable viewport.

More on overflow-y from MDN

The overflow-y CSS property specifies whether to clip content, render a scroll bar, or display overflow content of a block-level element, when it overflows at the top and bottom edges.

scroll The content is clipped and desktop browsers use scrollbars, whether or not any content is clipped. This avoids any problem with scrollbars appearing and disappearing in a dynamic environment. Printers may print overflowing content.