When my bosses told me to "slick up" our website, with scrolling headlines and graduated tints and rounded corners and shadows and all that tired old tat, I rubbed my metaphorical hands gleefully and settled down to learn the very latest web languages (by which I mean, HTML 5 and CSS 3). That didn't take long. But then, as I'd expected, the hard part began: learning how to make these gimmicks work in each type of browser.
I'll spare you the ins and outs of that - the stylesheet is kinda messy, and at almost 600 lines it's about three times as long as it has any business to be, but it works. (It's even technically valid, at least according to w3.org.)
When I handed my designs over to my bosses for feedback, they loved them. The pages, though I say so myself, look pretty cool when viewed on PC, Mac, tablet or notebook. For good measure I even checked them on my Nintendo DS. Lovely. My only negative feedback came from - what else - Internet Explorer 9.
But how? I've got IE9 myself. The same version, on the same platform, looking at the same pages - yet the results are completely different. (For instance: my version of IE9 has no problem with supporting
display:table-cell, whereas yours evidently thinks it's the work of the devil.) What goes on?
It took me a whole afternoon to work out the answer to that.
Microsoft, rot their vile souls, have built "handy" features into Internet Explorer called "browser mode" and "document mode". Which means that the same browser can apply completely different sets of rules to interpret the same code.
On paper, like most of MS's output, it's not a bad idea. In practice, also like most of MS's output, the implementation is awful beyond description. See, the thing is: there's no way to control which settings someone else's browser will apply.
Oh, in theory there is. There's a tag you can put in your page header to tell it "This page is meant to be rendered in IE 9". That's annoying enough in itself - why would a browser need to be told not to pretend it's something else? And obviously it doesn't work if the client isn't using IE 9. But what's really winding me up, right now, is that it still won't work even if they bloody are using bloody IE9.
For a partial explanation, look at this unholy monstrosity. But even that is only a small part of the horror. See, while the page author has some minimal control over the "document mode", they have no control at all over the "browser mode", which overlaps with and partly overrules the "document mode". The browser user sets that at installation time - usually without even realising what they're doing, because it's disguised as a question about "how would you like to view the web?". And if you've downloaded the page in "IE7" mode, and then tried to apply "IE9" layout to it, the result is an ungodly hybrid that would make Doctor Moreau blench.
To add insult to injury, the mode that sometimes gets applied without realising it is "IE7". So I have to hack the design to work in IE7, despite the fact that nobody in the entire world actually uses IE bloody 7. (Well, okay. To be strictly accurate, according to our website logs, about 10% of IE users do - although I'm guessing most of those are really using later versions that are just pretending to be IE7.)
What people do still use, in their droves, is IE6, which is an entirely different pain in the fundament.
So now I'm having to insert four, count them, four separate stylesheets - for IE6, IE7, IE8 and (every other browser including IE9). And just hoping to goodness that IE10 works acceptably with the IE9 design.
Keynes, famously, is supposed to have argued that in times of recession, it would be worthwhile to pay the unemployed to dig holes only to fill them in again. That's about how useful I've been feeling this week.