Yeah, you heard me. Let’s all say it together this time:

Internet Explorer 5 is the New Netscape 4!!!!!!!!!

What would have been a three week build of a static site is instead a 5+ week build of a static site. Thousands of client dollars WASTED on an old and out-of-date browser based on antiquated technology. IE5. Perpetrator of the Padding Bug, the Egregious Box Model Hack, the Traveling Float/Margin Bug, among others.

I got started in this business during that single day in 1999 when IE4 and Netscape 4 were on even footing. At 9am the next day IE started to pull ahead, and (AOL paleo-reactionaries aside) Netscape 4 is now fast on its way to an unmarked grave. So now is the time to pick the next weakest link and start in with the Death of a Thousand Cuts.

IE5. New NS4. Particularly IE5 on the MAC, which though it has “Practically the best standards support of any mainstream browser” has specific bugs which make it impossible to write clean stylesheets. The fact that it INTERPRETS the code correctly does by no means suggest that it DISPLAYS the output correctly. It doesn’t.

There is a well-known IE6/PC bug when applying floats, that horizontal margins tend to be doubled. Spec a 10px margin to the left of a left-floated DIV tag, and IE6 will give you 20px. Sucks, but easily compensated for with a little math and a single alternate line of code.

Float a bunch of DIV tags in IE5/MAC and apply a 10px bottom margin to each. Force them to wrap around something like e.g. an image. Suddenly, the fourth DIV tag has doubled it’s bottom margin, turning an elegant grid into an unfinished tangram! And no global styleshete changes will alter the behavior!!!1!$@1!

So the solution becomes, target that one DIV tag with an egregious ajacent style selector, like div.container+div+div+div+div. Those of you who speak CSS will understand this. Those who don’t … just take for granted that IT WORKS!!!!

Reload the page and…beautiful. The DIV has been cowed.

But…but…there is another DIV tag, one row down, one column over…

20. Pixel. Bottom. Margin.

Everything below it: U.G.L.Y. You Ain’t Got No Alibi.

So we add another rule: div.container+div+div+div+div+div+div+div. Kick that sucker back in line. Works. But now…one down, one over. You guessed it. 20 pixels.

You know what? Fuck it. Fuck you, IE5 on the PC for not displaying dashed borders, and Fuck You and Everyone Who Looks Like You, IE5 on the Mac, for the Traveling Float/Margin Bug.

The days of putting stylesheet pearls before browser swine are OVER!

So join me, O my brothers and sisters, and scream it unto the heavens:

Down With IE5!!! Death to IE5. As Was Netscape 4, So Now Is IE5!!!!! IE5 is the New Netscape 4!!!!

There. I feel better.