How To Serve Internet Explorer It’s Ass On A CSS Platter
A tip for those of you needing the easiest and most efficient way to build a site and make IE behave when rendering CSS. The secret is IE conditional statements. These are special html comments that only IE can read. The trick is to link to additional style sheets that overwrite rules in the master style sheet in a more IE friendly way. By nesting the links within these comments, only IE sees them. Other browsers skip right over them and behave as expected.
Here is the syntax:
<head>
<link rel="stylesheet" href="css/master.css" type="text/css" media="screen" charset="utf-8" />
<!--[if IE]><link rel="stylesheet" href="css/ie.css" type="text/css" media="all" charset="utf-8" /><![endif]-->
<!--[if IE 7]><link rel="stylesheet" href="css/ie7.css" type="text/css" media="all" charset="utf-8" /><![endif]-->
<!--[if IE 6]><link rel="stylesheet" href="css/ie6.css" type="text/css" media="all" charset="utf-8" /><![endif]-->
<title>BKWLD</title>
</head>
For best results, one should always develop their site using a standards compliant browser as a reference point, such as Firefox or Safari, then make adjustments to the IE style sheets once build is complete. I prefer to design with Firefox, as I find fewer inconsistencies between it and Safari when I develop this way. I say this as a Geko hater.
