You are currently browsing the archives for the Website design category.

Archive for the ‘Website design’ Category

If your webpage is short and fits in the browser window without scrolling, then there is no need for a scrollbar to appear on the on the right side of the browser, right?  Wrong.  If you have anything centered on your webpage, then you will have problems.  You’ll get “flicker” as you move from a non-scrollbar page to one with a scrollbar.  You see, a scrollbar take up space.  “Centered” in a browser window that has a scrollbar is not going to be in the same place physically on your monitor as “centered” in a browser that has no scrollbar.

So when someone is looking at your website, and they go from a short webpage without a scrollbar to a longer page with a scrollbar, the centered content jumps around a little, as the scrollbar appears and disappears and re-appears, thus changing the width of the webpage area.  Very frustrating.  This is a Firefox issue, by the way.  Doesn’t much happen with IE.  But Firefox has a significant number of users, so… if the fix is easy, why not?  You want your website to look professional, even in Firefox, don’t you?

The fix is dog-simple.  Add the following line to your CSS file.  I put it in first thing, that way I know it’s always there.

html {height: 100%; margin-bottom: 1px;}  /* This forces a scrollbar on short pages in Firefox */

And there you go.  Now you’re forcing a scrollbar to appear on every page.  Scrollbar bug in Firefox fixed.  Woo-hoo!