Sometimes the little thing you forget causes you the most pain

I spend a lot of time wrestling with CSS working round IE’s broken box model.

A lot of this pain could have been avoided, if only I’d remembered about the “doctype switch”.

If you don’t know what a box model is, or why IE’s is broken, have a look at this.

There are lot’s of CSS hacks that help you get around this issue, but by far the most effective solution is to put IE into “Standards Mode”, this is done using a doctype declaration. As the name sort of implies, this is a line of code that declares the type of document you are serving to your client.
I knew that I could use a doctype to change IE’s rendering mode (because gnarly reminded me the other day), but I couldn’t remember which one to use. There are lot’s of articles on the web about this, but none that I saw simply said “if you want standards mode – do this”.

So here it is…

Thanks to Hurricane on the DDN Forum

If you want to put IE into standards compliant mode

Use:

A full strict doctype, either HTML 4.01 strict or XHTML 1.0 strict without an XML prologue.

In other words:

  1. <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

needs to be the first thing in your xhtml document