Site shifts on long pages in opera and mozilla

lack of scrollbar shifts the positioning

[rsart]

I'm sure people have noticed this before.

I created a site this morning, and put it online. I checked it in IE6, Mozilla and Opera and ironed out the kinks.

I thought I had a CSS problem, but now I think its the browsers and how they display pages.

When I look at the site in Mozilla or Opera and flip between a short page with no vertical scroll bar and a longer page that does have a scroll bar I get a noticable shift in the page.

I realised that it was that IE always has a vertical scroll bar on the browsers, and the others only when it is required.

So, is there any way to prevent this, short of making all my pages either short or long?

[encyclo]

It can be quite frustrating to have this effect in Mozilla / Opera, but it is difficult to avoid. There is a way to force a scrollbar in all browsers, but it's a massive hack - up to you whether you think it's appropriate in your case.

Firstly, to the HTML, you add:

<div id="scroll"></div>

Then in your CSS file, you add:

#scroll { 
position:absolute; 
top:0; 
bottom:-0.1px; 
width:1em; 
z-index:-1; 
}

This has the effect of placing the scroll div just under the bottom of the page, thus forcing the scrollbar in all browsers.