IETab for XHTML Traps
By Tim Caynes on Mar 19, 2008
You'd think I would check. First rule of web design and all that. I mean, we extensively test our web design components against all the platform and browser combinations out there, and Andrew and Greg are constantly redefining CSS elements so that we maintain a consistent style, whatever you're using to connect to us.
But that can't save me from being a lazy arse. I like to put images in blog posts to illustrate points, or just to make myself less uninteresting than I am. I also like to have them aligned left or, usually, right, with text wrapping around them. This is from the HTML 1.0 handbook, right? So I was rightly ashamed of myself when I installed the IETab add-on for Firefox the other day and took a look at some blog postings. Initially, I'd installed IETab to try and sync up PicLens with a thumbnail folder view of an enormous image directory as presented as a windows explorer view. That didn't work, but I thought IETab was kind of interesting, so I duly went away and 'IETabbed' my bookmarks.
Oops. seems that that old align=right hspace=8 vspace=8 ain't what it used to be, and probably hasn't been since about 2003 or something. For blog templates written in HTML 4 (of which there are tons out there I've used or written), this old syntax is just fine, even if it's like the 'Hello World' of web design, but, you know, if it ain't broke. Except it is broke. In XHTML 1.0 (correct me if I'm wrong, but only in your head), those handy attributes are deprecated, so if your doctype declaration contains the XHTML 1.0 string (like this blog template), the page rendering is undefined. No problem, then, if you've been using Firefox since forever, because Firefox just understands that some people out there can't code for toffee and gracefully deprecates on your behalf. Internet Explorer, however, throws its toys right out of the pram. Because we always gave IE a hard time in the past for being rotten with supporting web standards, it gets all fussy if you make mistakes these days. At least, mistakes in the way IE wants to implement XHTML.
Suffice to say, align=right translates to something like align=centerwithnowrapanddoitrightnexttimeidiot. Meaning this whole blog has looked a right old mess on IE since I started. My fault really. I should have checked. How authoritative I must have appeared, spouting on about web design standards, customer experience journeys, usability and everything, when the very page I was writing looked like someone has thrown up a flickr photostream at random in between the passages of pompous rambling prose like this.
Anyway, you're probably reading this, if anyone is, through google reader or something, so it really doesn't matter. A new class in the CSS for those images fixed everything pretty quick. In case you're using FireFox, and you're now thinking "oh, I might just take a look at my blog to see what it looks like but I can't be bothered to start Internet Explorer which I can't anyway because I'm on Solaris and I don't happen to have a virtual version of XP running somewhere", then try IETab. It eats memory like children eat cakes at a birthday party, but its worth it.
Listening Post: Sleater-Kinney: The Fox