There is one common mistake that we commit sometimes i.e. relying on Internet Explorer to do the job right. But that’s not mistake on IE’s behalf because we are doing something wrong with the way we are handling our HTML document.
Nowadays we all use MVC and our site is based on a common template, When declaring our styles and tags we miss one most important tag DOCTYPE or a Meta tag to tell IE how it should render our page.
According to the MSDN Quirks mode is defined as
Under Quirks mode the behaviour matches Internet Explorer when rendering a document with no doctype or a Quirks doctype. It is similar to the behaviour of Internet Explorer version 5 and the Quirks mode behavior of IE6, IE7 and IE8.
So the styles and layout will seem to mess up.
Easy fix to this problem is to declare a valid doctype for your layout template or HTML page as shown below
You can choose any that fits your document
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
Or other XHTML based DOCTYPEs
Using Meta tag
Include this meta tag in your page header
<meta http-equiv="X-UA-Compatible" content="IE=IE9">
I will always use DOCTYPE rather than Meta tag to tell IE how it should render current document.
For more information on how this works please visit the link I’ve provided in Useful Readings.
This will fix your page instantly and Internet explorer will load your page properly i.e. it won’t load your page in quirks mode anymore.
There is another thing you can do however if you would like to test your pages across different version of IE
Press F12 while you have your internet explorer opened
Developer tools will appear as shown below
In the above picture you can see that Browser mode is set to IE9 and my Document Mode is set to IE9 standards
Now you can play with these modes. I can test my webpage in IE8 standards or IE7 standards and also in Quirks mode just by flipping the Document mode settings from IE9 standards as shown below
This way you can test your site across different document modes and versions of IE.
So remember that first line of your page should be your DOCTYPE else page may appear messed up because it by default will launch itself in the oldest possible standards IE can support.
I hope this helps