IE6 is frakking up the sidebar of my website.
March 25, 2009 10:13 PM   Subscribe

IE6 is frakking up the sidebar of my website. How do I fix it?

The layout renders just fine in every other real browser, but in IE6, the sidebar gets pushed down below the main content. I imagine there's an easy fix for this using some CSS, but I can't quite figure it out.

At the very least, is there a way for me to display text only in IE6 to urge users to get a better browser?
posted by knguyen to Computers & Internet (8 answers total)
You might try this approach.
posted by fluffy battle kitten at 10:59 PM on March 25, 2009

The layout renders just fine in every other real browser
This is generally not the best attitude to have, in good part because it's sometimes just wrong. It's easy to blame IE6 because it's everybody's favorite hobby horse, but the fact is that in some instances it's actually more strict than other browsers. (As a sidenote, even IE8 is accepted as a relatively "real" browser now and still displays the problem.) All of which is just lead-up to pointing out that your markup is broken in several spots, any one of which could easily(though not necessarily) be the cause of this and the other browsers are just doing a better job of compensating, which is convenient but not always the best thing. Ignoring or obfuscating the underlying problem only means it'll surprise you later. Additionally, you shouldn't try fixing your CSS until you fix your markup; it's basically building on a cracked foundation.

You can more or less ignore all the "blah blah entity blah" errors for immediate purposes, but at lines 197, 201, and 202[1] you have bare LI tags. A little further down, an open IMG tag(probably harmless). At line 251 we have what's probably your real problem: several closing tag mismatches. If you keep going, you'll see that this manages to cascade all the way up to breaking your BODY and HTML tags. Fix those, and there's a decent chance this will take care of itself. Turning outlines on for all the divs suggests there might be some screwy widths, though, so an eventual CSS issue is still not out of the question.

[1] I can't promise these line numbers won't move by the time you read this, but they'll be close.
posted by Su at 2:06 AM on March 26, 2009 [2 favorites]

Best answer: Usually if a floated element gets pushed down it's because there isn't enough width to accommodate it, and if it's only happening in IE6 then it's probably either:
1. You have a margin on one of the floated boxes that IE isn't rendering accurately
2. The content within one of the boxes is too wide for it, and IE is expanding the box

By switching from margins to padding and/or checking your widths (or using overflow:hidden) you can work around these issues. Much as I'd love to ditch IE6 support I don't think it's going to be a viable option for most sites for at least another year.
posted by malevolent at 2:39 AM on March 26, 2009

Um, download IE8?
posted by fourcheesemac at 4:53 AM on March 26, 2009

Seconding Su.

You shouldn't even ask for help with a website if your HTML and your CSS aren't valid. You have 47 errors, you just made up "float:centre" for the fun of it, and now you wonder why your layout doesn't work?
posted by AmbroseChapel at 5:25 AM on March 26, 2009

Also, per su's note, check your links: You have unescaped "&" characters in some of them (eg line 13), which throws the validator for a loop, because it thinks a bare "&" is signaling the beginning of an entity (like  ). If it's part of a link, use "&" instead of "&" to escape them. Browsers won't know the difference in terms of how the link works.
posted by caution live frogs at 5:58 AM on March 26, 2009

Just an FYI I'm using firefox 3.0.7 on linux and the sidebar gets pushed down for me aswell.
posted by DJWeezy at 6:27 AM on March 26, 2009

firefox 3.0.7 xp same as DJWeezy.
posted by juv3nal at 9:52 AM on March 26, 2009

« Older Largest U.S. city without a Chinese restaurant?   |   What was the first website to hide troll's... Newer »
This thread is closed to new comments.