Why does this suck so bad in internet explorer
Written By cooper on Jun. 22, 2007.
11 Comments
Report Note
+ Clip This
Can someone tell me what the problem is with IE that the bottom the theme I just switched to sometimes looks jagged or stair stepped?

seanrox
Written Jun. 22, 2007 / Report /
That's the browser gods telling you to switch to a better, more compliant web browser :)
Which version on Internet Exploder are you using when this happens?
seanrox
Written Jun. 22, 2007 / Report /
That's the browser gods telling you to switch to a better, more compliant web browser :)
Which version on Internet Exploder are you using when this happens?
Griffin
Written Jun. 22, 2007 / Report /
Well Cooper, that might be because I don't know what I am doing :), though I'd like to think it's more an issue with IE being rude with code. I'd love to help out but I do not have access to Windows. I believe the theme should validate so it's probably an IE specific glitch. If anyone has a fix I'd be grateful, as I'm sure Cooper would.
seanrox
Written Jun. 22, 2007 / Report /
Not sure if the design you have up now is the one you are talking about but if so, there are 56 validation errors.
I'm sure fixing a few of those up might help the IE issue. It would be a good place to start.
bobbyh
Written Jun. 22, 2007 / Report /
OK, I see what the problem is. The Theme designer tried to create a pixel-perfect design. In IE6, however, the sum of the two columns (the main-column and the right-column) is greater than the width of "entire box of the main area". The right column is "floated left", but since it doesn't fit in the slightly-too-narrow "entire box", it gets pushed below the main column.
To fix this in IE6, you can use conditional CSS to widen the "entire box", which has the id "container".
You can search to learn more about conditional CSS for IE6.
The conditional CSS will be something like this:
#container { width: ___px; }, where ___ is some number bigger than the current width (920px) that you need for IE6. Experiment to find out what this number is in IE6.This fix will prevent the right-column from "floating" under the main-column.
Oh yeah, before you do any of this, you should validate your HTML like seanrox says. Try pasting in the HTML of your page here. Also, try validating your style.css here.
Validation is particularly important when you're using a STRICT doctype, as your theme uses...
Good luck,
Bob
cooper
Written Jun. 22, 2007 / Report /
I wasn't using IE, but I checked to see what the theme look like in IE.
I may be a tech ignoramus but I am not so stupid as to use IE fro myself.
56 gosh darn
Well a lot of them are due to the flickr rss thing at the bottom which I like so I'm not removing it.
I'm off tomorrow so maybe I'll play around and see if I can fix some of them them. Most of that jibber jabber at the validation site I have no idea what it means.
Why is it that everyone time I find a plug in or a theme that person shows up here in notes?
First I didn't know geek with lap-top boy was you sean and now I find a theme and that individual shows up here as well. It seems like I just can't get away from it. Kind of scary really.
I actually love the look of the theme Griffin I just meant it sucked in IE which is not an uncommon problem I hear.
Griffin
Written Jun. 22, 2007 / Report /
Cooper, a lot of those validation errors are because of ampersands and equal signs which if you have access to the code you can fix quickly by replacing all the & with "&" - minus the quotes.
You might also want to check to make sure the flickr code in the footer is wrapped in an
tags. You can do this by heading to the flickr options page and where it asks if you want tags before and after typing in
<li class="flickr"> and
. Or you could leave the options blank and place the code around the flickr call in the footer. These are just shots in the dark but it helps to start from a clean slate and then see what you got. Unless of course someone can jump right in with an answer.cooper
Written Jun. 22, 2007 / Report /
Thanks bobbyh.
What that means then is that I have to make a separate style sheet for IE6? I am looking at it in ie 7 so do I then have to make a separate style sheet for that as well?
I'll check them over tomorrow, thanks.
Griffin
Written Jun. 22, 2007 / Report /
Well there you go, Bob saves the day. Sorry you had a bit of trouble Cooper. And much thanks for pointing out the issue Bob. I appreciate that.
Griffin
Written Jun. 22, 2007 / Report /
Oh, and Cooper, no problems. I'm quite pleased when people bring up issues with themes. I'd rather have someone speak up than give up so thanks to you for pointing out the problem. It's an opportunity to make them stronger, and learn a bit in the process. And all love for the look really should go tri stars way. All I did was stuff some Wordpress guts into the frame, though apparently not perfectly.
bobbyh
Written Jun. 22, 2007 / Report /
Cooper, you don't have to make a separate style sheet for IE6 or IE7. Just put the little bit of extra stuff you need for IE6 or IE7 into its own style sheet. Then, link to those style sheets after the full style.css.
Ah, I didn't catch that Griffin ported this design into a Wordpress theme. Neat! :-)