Force a vertical scroll bar in non-IE browsers to avoid page jump

Webpages that don’t fit vertically in the browser window have a vertical scroll bar, pages that do fit in the browser window don’t have this scroll bar. All is great until you click from a short page to a tall page and the content ‘jumps’, in order to make room for the scroll bar.

If you’re a developer you’re used to this and probably don’t even notice it. I’ve had multiple clients ask me why the page jumps and have had to explain the reasoning, just to hear “oooh that’s weeeird, isn’t it???”. 

No, I just explained it. Anyway, to avoid this conversation, add the following CSS to your style sheet. This code forces the vertical scroll bar, and voila, no more page jumps or calls from the client.

html { overflow-y: scroll }