January 4, 2013

Persist Scrollbar on Short Pages

Occasionally I land on a site where the scrollbar disappears on short pages, which causes the whole layout to jog a bit to the right. Also, the viewport width increases, changing some percent values as well. It seems to happen in most browsers with the exception of Internet Explorer.

scrollbar-jump

Maybe it’s just my OCD, but the page jumping really annoys me, especially on sites I’m building. It makes me cringe. Anyways. It’s certainly not the end of the world, but there is an easy fix if you’re so inclined.

html {
  /* show scrollbar regardless of page height */
  overflow-y: scroll; }

I’ve included this in my projects for many years, and I thought it was worth sharing for those interested.