asked on

Scrollbar cut off in IE but not FF - URGENT

OK, so I'm building this website, and I'm doing it with CSS (as a learning thing and as good practice). So, I have it working, except for one thing: In IE only (not FF), the scrollbar is halfway cut off (like it was cut top to bottom) and one linebreak down the page (or so). Any ideas? I can post all files if needed. Thanks

mdg12

Please post the files.
Is the scrollbar that is being cut-off part of an element on the page? (e.g. scrolling DIV or textbox)
Which window resolutions does the problem occur?

windows_eXPert

ASKER

No, it's the standard page scrollbar (body). It's actually running off the edge of the window, as if IE believes that the window is ~5 px wider. What I know the problem is is the CSS menu I have on the left, but I don't know what I can do to fix it. Real browsers don't have the problem.

http://www.filefactory.com/?5ffb14 is a link to the .zipped directory. The scrollbar is set to auto. You can add a bunch of <br/>s or just resize the window to reproduce the problem.

mdg12

the problem lies in IE6hack.css

their "hack" to have the menu "fill up" the screen is:
html {
overflow: hidden;
}
body {
height: 100%;
width: 100%;
overflow: auto;
}

this has the effect of hiding the normal browser scrollbars, resizing the body to fill the screen, and using the scrollbars from the body tag...

honestly, without diving into the menu code too much, i'd suggest either:
1) taking out the ie6hack.css (comment it out in menudec.js) and dealing with the slightly different-looking page
2) find a different menu

windows_eXPert

ASKER

I was afraid of that...

Piece of #hit IE... I never really understood why people hated it so much before I started doing webdev, and CSS. At least the menus are navigable, although it would have been nice if I could have done it

http://jessey.net/simon/articles/007.html (the page I got it from) works fine in IE. Does it have to do with a conflict in the menu code?

It really pisses me off that I have to make something work in FireFox, and then go "hack" it to make it work in IE. At least it's possible. Oh well, now that alt browsers are gaining on them, it means that webdevs have to code for FF and like, and more are going to say "screw this, it doesn't look as good in IE, whatever". I'm going to put a big notice "This site will look better in <a href="http://www.getfirefox.com">Firefox</a>". And Screw IE.

Anyways, that's pretty much what I had thought. If that page doesn't give you any insight, and nobody else comes up with a solution, you get the points at this time tomorrow.

~windows_eXPert~

ASKER CERTIFIED SOLUTION

mdg12

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

mach-

This is how you fix it:

Get rid of ie6hack.css

Add this line to menu.css:

html, body {height: 100%;}

windows_eXPert

ASKER

Hi guys - Thanks for the responses. I can't test them today, and I won't know for sure until Monday (I forgot to get the files from work). I will try it out though, and let you know by tomorrow.

Thanks again

windows_eXPert

ASKER

Hey, mdq12, it worked! And I keep the same feel between browsers!

Congratulations!

~windows_eXPert~