Targeting Different Browsers with CSS & Conditional Comments

Sep 11, 2008 by

Simply put, every web developer must deal with browser inconsistency’s. Fortunately CSS hacks are very much a thing of the past, and there are better solutions to cross browser compatibility. My method of choice is Internet Explorer’s conditional comments. These allow for the separation of Explorer specific code from “valid” code.

XHTML

CSS (ie.css)

/* General ------------------------------------*/
.clearfix
{
    zoom:1;
}
/* IE6 ----------------------------------------*/
* html body
{
	background:red;
}
/* IE7 ----------------------------------------*/
div > p
{
	background:blue;
}

How it works

Conditional comments only work in Internet Explorer. This allows us to give special instructions for only Explorer. They are supported from Explorer 5 onwards, and it is even possible to distinguish between 5.0, 5.5 and 6.0.

Comments

No comments have been added yet.