CSS Gurus - what am I doing wrong here?

I’ve noticed a problem on my website that manifests in IE - in the guestbook.

I want it to look like this, but in IE6, it looks like this - the grey background of the alternate posts (and presumably, invisibly, the white background of the other ones too) bleeds out of the container, also, the content of successive posts seems to drift a little to the left, eventually ending with the text overlapping the dotted edge of the box.

What am I doing wrong here?

It looks okay to me in IE7, so it’s probably just a quirk of IE.

And speaking of quirks, you have your Doctype in Transitional, which is what’s known as “Quirks mode” for IE. Try it in Strict and see what happens (just as an experiment - it may mess other stuff up).

The short answer is that you’re probably not doing anything wrong – IE is. The IE rendering engine is notoriously bad, especially prior to IE7. What you’re seeing is almost certainly a consequence of IE’s broken box model implementation. You can probably fix the problem with a little extra CSS.

The drifting text is probably the same phenomenon as the IE6 Three Pixel Text-Jog, but it could be something else.

Do some googling on the Holly Hack, and haslayout. You can probably fix both problems by forcing IE to believe that the relevant elements have layout.

And when you want to force IE to do something, conditional comments is a good way to do it.

I probably should do this, but there’s so much in my site that isn’t compliant with Strict, it might well cause more problems than it solves.

I’m not by any means an HTML or CSS guru, but I don’t think this is right. Using “Strict” in the DOCTYPE disallows certain deprecated tags, which “Transitional” allows. You get “Quirks” mode in IE by leaving out the DOCTYPE tag entirely. This mode not only allows the deprecated tags, but also behaves as if the newer version of IE still has some of the browser bugs of older versions. Some (billions of) pages were coded for older IE browsers and rely on the bugs for proper rendering.

Or am I full of fertilizer?

You may indeed be right, I also am no expert on the application of Doctypes.

Though it may, in fact, be somewhere in between. I’m pretty certain that you do need some kind of Doctype setting for “quirks” mode.

But it’s good practice to leave out the deprecated tags anyway. Because they’re deprecated. Soon enough they’ll be unsupported entirely.

I find the whole thing horribly confusing. It’s like CORBA used to be … one big reason CORBA is practically dead. I’m anxiously awaiting the day when all browsers implement all the standards consistently and according to specs. That’s currently scheduled for the 12th of Never. I bet they slip though.