What is quirks mode and how to avoid it?

HTML & CSS
1

Hi !

I am newbie at web design and recently have come across a bug in IE called quirks mode, I don’t really understand what this is ? Can anyone please explain to me what this is and how to avoid it ?

The template I have been using for my web designs is :

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>



</body>
</html>

Do I need to add or remove some things from this to avoid quirks mode ???

2

Remove the first line - the XML prologue. Anything before the DTD - the bit that starts ‘<!DOCTYPE…’ - will give you quirks mode in IE. What is quirks mode? Bad news - that’s what it is.

3

Quirks mode means that a browser ignores parts of the CSS standard and tries to emulate the behaviour of older, broken browsers. Usually IE5.

Quirks mode was introduced in IE5/Mac, which was one of the most standards-compliant browsers available when it came out. In order to prevent old, badly written sites from breaking, they sniffed the doctype declaration to determine whether or not the document could be expected to be authored according to W3C standards or to the quirky old IE ‘standard’.

Doctype sniffing is also used in IE6/Win, but it’s very primitive. Anything before the doctype declaration throws it into quirks mode; an XML declaration, or even an SGML comment.

Since IE does not support XHTML at all, you must deliver the document as text/html to it. That means it’s no longer XHTML at all, so there really shouldn’t be an XML declaration present anyway.

If you want a strict rendering mode (recommended), make sure the doctype declaration is the very first thing in the file, and make sure to use a complete doctype declaration, i.e. including the URI for the DTD at the end like in your example.