Wednesday, 1 July 2009

Centre aligned web pages and vertical scroll bars

If you have ever had a website that has a centre aligned div then you know the pain of scroll bars.  I’ve always wished that browsers would reserve space for scroll bars so that your content was not affected.

Seems like the way to go about making your pages sit still is the force the vertical scroll bar into existence.  It’s not great, but fortunately it’s really easy.

html 
{
    overflow-y: scroll;
}
This simple CSS entry will enforce the scroll bar.  It works in everything from IE6 to Chrome (including Safari, Opera and Firefox).  I’m certainly not the first person to blog about this, but I figured it was worth posting about anyway.  What I want to know is, is there a better way?!?

No comments: