Martin Francis

Blog of Web Designer Martin Francis

Jun 10

What is Quirks Mode?

blog image relevant to text

What is Quirks Mode? How does it solve certain problems? What problems does it at the same time raise?

Quirks mode is a way that a browser can interpret CSS. Older browsers have their own “quirks” and to make sure that website pages rendered correctly web designers would have to write CSS with browser specific quirks.
So in the old days different browsers had different CSS.
Browsers were faced with a problem when the W3C published it’s web standards knowing that web designers would write CSS to conform to that standard and browsers would have to render the standard because of all those legacy pages with their quirky CSS code.
To solve this browsers have 2 to modes for rendering pages, a quirks mode for old pages with old quirky CSS, and a strict mode for the web standard version.
The browser would decide on which way to render a page depending on the type or lack of Document Type (doctype).
This is called doctype switching
No doctype triggers quirks mode.
Most doctypes including new or unknown ones trigger strict mode except for some older doctypes that might, depending on the browser trigger quirks mode.
The most common problems for designers are:-
1. Box model bug that occurs when IE is put into quirks mode. Instead of content width meaning just that as per the W3C standard box model width includes content, padding and border
2. Margin auto is not supported in most browsers quirks mode so a centrally aligned website may move to the left.
3. Images can have extra paddng at the bottom
For a full list of quirks mode problems and which problem affects which browser go to

Posted by: martin Last updated on:2010-07-28 12:33:32
Tag:- quirks