What Is Quirks Mode?

[blufive]

Since I've yet to find a succinct definition anywhere, and it seems to be a FAQ in web development circles, here's the answer I just wrote over on the SitePoint Forums, with apologies for those who already know or don't care:

Several modern browsers (Mozilla, IE6/Win, IE5/Mac) have two (or more) rendering modes. The browser will display the page differently depending on which mode is it is using.

In most cases, there are two main modes:

1. Standards mode - the browser does its best to display the page exactly how the W3C standards say it should. In this mode, the browser may be very unforgiving of errors in the page source code
2. Quirks mode - the browser does its best to display the page as the author intended. In many cases, the browser will mimic bugs (quirks) in older browsers (for example: IE6, in quirks mode, uses the broken IE5 CSS box model) The browser will probably be more forgiving of errors in the HTML/CSS, but may do Weird Shit™ because some web authors have become used to such behaviour.

So which one does the browser use for a particular page?

That's a complicated question, as different browsers do it differently. In most cases, including a DOCTYPE and writing mostly-valid HTML will make the browser use "standards" mode.

In general quirks mode can be rather unpredictable, and vary wildly from one browser to another. If you know HTML/CSS and want to do a good job, you should aim to trigger standards mode. For a start, when IE and mozilla are both in standards mode, making your page look good in both browsers is much easier.

Comments

[kingandy]

Wow. I didn't know it was possible to do trigger any kind of standards mode, I've always worked to the W3C standards as close as possible and relied on exhaustive cross-platform testing ...

... or at least I would, if my current employers believed in that sort of thing. Luckily our primary development is for an in-house intranet type of thing so we're allowed to say "All your users must be on IE6" or whatever.

[stsquad.livejournal.com]

You burn in hell for "IE only" pages you know. Which remind me, did I ever run our pages through the w3c validator? ;-)

[kingandy]

Platform is irrelevant; the point is it's not a web site, it's a web-based application with a limited number of users, so we get to specify preconditions. We selected IE because it's less hassle - most of the PCs will likely have it installed already.