More in depth on Conditional Comments
Conditional comments allow special syntax constructions for checking the IE version and are proprietary to Internet Explorer for Windows. A conditional comment is an HTML element that, in IE may conditionally be read, but, to all other browsers looks like an HTML comment and is ignored. Here is an example of some markup with conditional comments:
<!--[if IE]>
<p>Only IE shows this paragraph.</p>
<![endif]-->
<p>A paragraph that all browsers display</p>
In the above example, the first block of code has a paragraph of text inside a conditional comment. Internet Explorer has been designed to examine all HTML comments for certain syntaxes, and when it finds such syntax IE will simply read and parse whatever is inside the conditional comment. Because conditional comments are hidden inside syntactically correct HTML comments, all other browsers just see a comment and do not display the paragraph contained within it.
The next paragraph is outside the conditional comment and displays normally.
Deeper with Version Numbers
Not only is IE styled differently, but different versions of IE are styled differently.
Conditional comments support targeting of specific browser versions, which means divs can be created that will be used in CSS selectors to target not just IE in general, but specific versions of IE. Here is an example of how this might be done:
<!--[if gte IE 7]>
<div id="ie7andup">
<![endif]--><!--[if IE 6]>
<div id="ie6only">
<![endif]--><!--[if IE 5.5000]>
<div id="ie5-5only">
<![endif]--><!--[if lt IE 5.5000]>
<div id="ie5-01only">
<![endif]--><div id="anyelement">a box with some content</div>
[... more page content ...]<!--[if IE]>
</div>
<![endif]-->
Only one of the four conditional divs will be created in IE, depending on the version of the viewing browser, and none of them will be created in other browsers. Note that only one generic all-IE div end tag is required, so no need to have multiple CC's for this task.
The first div, #ie7andup, will be created in IE version 7 and up. The "gte" means "Greater Than or Equal to."
The second div, #ie6only, will be created in IE version 6 alone.
The third div, #ie5-5only, will be created in IE version 5.5.
The fourth div, #ie5-01only, will be created in IE version 5.01. The "lt" means "Less Than." IE4 is not included, since conditional comments were not introduced into IE until version 5.
When targeting IE5.5 you must add the zeros to the 5.5 or the browser may ignore the conditional comment. <!--[if lt IE 5.5]> is not good enough, it must be <!--[if lt IE 5.5000]>. There is no good reason for this, that's just how it works. gte IE 7 stands for "greater than or equal to IE7," while lt IE 5.5000 stands for "less than IE5.5." When writing these CC's, exact conformance to the syntax is required. Any error will cause the CC to become a normal HTML comment.
The corresponding CSS, making use of descendant selectors, looks like this:
/*** All browsers ***/
#anyelement { border : 2px solid black; }/*** For IE 7 and up ***/
#ie7andup #anyelement { border-color : blue; }/*** For IE 6 ***/
#ie6only #anyelement { border-color : green; }/*** For IE 5.5 ***/
#ie5-5only #anyelement { border-color : purple; }/*** For IE 5.01 ***/
#ie5-01only #anyelement { border-color : red; }
