Cross Browser Issues: CSS Hacks, Understanding Compatibility - How to Handle Differences

How to Handle the Differences

One thing you can do to help Internet Explorer truly do what you want it to do instead of “figuring it out for you” is to put your web page for IE into quirks mode.  Quirks mode is a rendering mode where a browser tries to handle sloppy code in the way that they did in the mid- to late 90's.  In essence, in quirks mode the browser “purposefully imitates the lax parsing, rendering, and bugs in earlier browser versions so that they render the old, quirkily coded pages exactly the same as they used to.”  On the site, css-discuss.incutio.com, you can find a good list of the quirks that are reproduced in which browsers when using quirks rendering mode. 

The problem with this is that if you put your page into quirks mode for IE or older browsers, then you’re putting the page into quirks mode for other browsers as well.  Therefore, you have to use a trigger that will switch between strict mode and quirks mode depending upon the type of browser that is detected.  This is referred to as “doctype switching” which is supported by all modern browsers.  According to the standards, any (X)HTML document should have a doctype which informs the browser of the version of (X)HTML the document is using.  A doctype looks like this:

The other mode that modern browsers recognize is strict mode.  Your page does not have to validate according to the chosen doctype; the mere presence of the doctype is enough to trigger strict mode.  There is one exception to this rule:  in IE 6, if a doctype that triggers strict mode is preceded by an xml prologue, the page displays in quirks mode.  It looks like this: