The scroll bar is missing in IE6 due to issues with relative positioning in CSS

[dustiehollon]

I am developing a page that is all css and I am using "relative" postitioning to position the main text area of the page. In IE6, I am missing the scrollbar on the right. I'm not having this problem in Firefox or IE7.

Check out the page here: http://galvestonairconditioning.com/

Heres the css:

#mainbody {
top: 175px;
position: relative;
left: 200px;
width: 549px;
text-align: justify;
}

Any help that anyone could pass my way to resolve this issues would be greatly appreciated.

Thanks!
Dustie

[snowdonkey]

The scroll bar works in IE 6 for me. Have you since fixed the problem?

[dustiehollon]

The scroll bar works in IE 6 for me. Have you since fixed the problem?

No, I haven't fixed it. It does show some but not 100% of the time when it's needed.

[webgnome]

I have a similar problem with one page on my site. The entire framework is the same, but on this one page there's the problem that the scrollbar doesn't always appear in IE6.

Anyway, I looked at your styles and made these changes:

#container {
margin: 0px auto;
padding: 0;
width: 744px;
position: relative;
}

#mainbody {
top: 175px;
position: absolute;
left: 200px;
width: 549px;
text-align: justify;
}

That seemed to fixed the scrollbar problem. Alternately, I would've chosen to use margin-left and margin-top instead of left and top in #mainbody, thus removing the need for the position: relative.

Now if only I could fix my own problem as easily.

[AricC]

I have a similar problem with one page on my site. The entire framework is the same, but on this one page there's the problem that the scrollbar doesn't always appear in IE6.

Anyway, I looked at your styles and made these changes:

#container {
margin: 0px auto;
padding: 0;
width: 744px;
position: relative;
}

#mainbody {
top: 175px;
position: absolute;
left: 200px;
width: 549px;
text-align: justify;
}

That seemed to fixed the scrollbar problem. Alternately, I would've chosen to use margin-left and margin-top instead of left and top in #mainbody, thus removing the need for the position: relative.

Now if only I could fix my own problem as easily.

Have you found a fix for the problem?

Aric

[dtc]

Dustie,

I'm had the same problem some years back. I can't remember what fixed it and it is now part of my standard library for AJAX with PHP generated by Perl - so it's a bit specific and hard to extract - however .......
before I over complicated things I found my working solution when I was guided by Simon Jessey's article and examples at http://jessey.net/simon/articles/007.html

Take a peep at his ie6hack.css

[HTML]html { overflow: hidden; }
body { height: 100%; width: 100%; overflow: scroll; }[/HTML]

I also had to indent my right hand panel in order to view the scroll bar
[HTML]#top_right { position: absolute; top: 0px; right: 12px; z-index: 2; }[/HTML]
and this was a good place to put that too so that it doen't effect proper browsers that comply with W3. There is only the one definition (right) in the real code - all included here for completeness. Don't forget to put ie6hack after all your styles.

I spent ages trying to avoid a hack - but in the end resigned myself to it. Another case of IE wasting everyones time I guess. I wonder how many hours are lost through using Microsoft - I guess it would make sickness seem insignificant if someone was to account for them!

Hope this helps

Aric - RU the ex-DiSoft Aric?

David T-C in unusually rainy Devon - UK

[AricC]

Aric - RU the ex-DiSoft Aric?

Nope never heard of him.

[drhowarddrfine]

If you guys have links to these problem pages, or can post the complete code, we can fix the problem.