Pummel IE into standards-compliance

Dean Edwards has written some JavaScript to force Internet Explorer to conform to W3C CSS standards. All you have to do to use it is sniff for browser and version, then add an extra JavaScript call for IE after your existing JS and CSS.

This is great. I’m at the beginning of the lengthy (lengthy because I’m lazy, not because there was a whole lot to my web site to begin with) process of rewriting my web site, which was long overdue. Like the previous version, this is going to be entirely in valid XHTML 1.0, but this time it will also have a 100% CSS design/layout. This means the layout will be completely table-less, among other things. This is actually fairly easy if you’re working with modern web browsers, but working around IE’s rendering bugs and lack of CSS2 support is a bitch. It’s hard to believe the browser with the worst CSS support is the most commonly used. No, I guess it isn’t. Yay, monopolies.

Anyway, assuming this works as advertised, using this will mean I won’t have to jump through any special hoops or dumb-down my CSS for that 90% of the internet who are still living in 2001. Good news, indeed, especially since it seems that Microsoft won’t be making any major changes to IE until the next version of Windows comes out in 2006 (or later).

Question: Why are people still using IE, anyway? I suppose most people who don’t design web sites don’t care about standards compliance, but other browsers offer much more in the way of features as well. And I know that some people who do web work, either for fun or profit, still don’t use anything else, even for testing. Is it just inertia, or do they actually prefer IE for some reason?


kscaldef says:

Still living in 2001? I think you mean still living in 1997…

This is pretty cool, but as far as I can tell, it doesn’t help with the fact that IE’s box model is broken. This just lets you use CSS2 selectors.

Personally, I think I’m just not worrying to much about IE as I transistion my website. (And, also, not trying to do pixel positioning, which seems to be what causes the most trouble with IE.)

kchrist says:

I was being generous about the year, IE6 came out in 2001. But yeah, closer to 1997 where technology is concerned.

I had the same thought about IE’s broken box model, but I guess you can’t have everything. Selectors are a big help, as is support for min-width and min-height. Hopefully development will continue on this.

I’m worrying a little about Win/IE, only because it’s what everyone else seems to use. I just installed Virtual PC but haven’t actually tested my new layout in it yet. It looks great in Mozilla and Safari, which means it will probably blow up all over the place in IE. I’m not even going to bother with Mac/IE because a) most everyone will have moved over to Safari before too long, and b) it’s even more broken than Win/IE, and there’s no easy fix for that one.

My new design does require a fair amount of positioning, but I don’t think it’s anything IE can’t handle. I used the same technique on my department’s internal web site at work, which I designed and maintain, and it looks fine in IE. A few pixels difference here and there isn’t going to change the look noticeably. That site is table-less XHTML 1.0 transitional.

kscaldef says:

I’m trying to avoid absolute pixel positioning if I can at all help it, but CSS seems to force me into it. Well, if you understand why that happens or how to fix it, let me know…

kchrist says:

Your images are overflowing their divs because floating elements are put outside the normal flow of their containing elements. Unfortunately, I don’t know a good way to achieve what you want without setting the height of the divs specifically.

kscaldef says:

Yeah, I pretty much figured that the answer was, that’s just how floats work. I’m sort of annoyed, though, because there’s still no good, simple way to deal with columnar formatting. You seem to be stuck with either using floats and hacking around the fact that they aren’t really meant for creating columns, or sticking with the trusty old table.