Conditional Comments for Internet Explorer

Example One

Check out this page.

This is what it looks like in IE 7 or 8.

This is what it looks like in IE 6.

View the source of the page to see if you can tell why.

Example Two

I’ve done something similar (but more subtle and appropriate) at think.ingcreative.com:

What it looks like in IE 7 or 8:

What it looks like in IE 6:

For explanations and code snippets, see below.

More information on conditional comments

• Internet Explorer Conditional Comments — Sitepoint
• "Conditional Comments" — Wikipedia
• About Conditional Comments — Microsoft
• Targeting IE with just one stylesheet — PositionisEverything

Conditional Comments Code Samples

Feed IE 6 a specific stylesheet:

<!--[if IE 6]>
        <link rel="stylesheet" type="text/css" href="assets/css/ie6.css" />
<![endif]-->

Feed a specific stylesheet to all browsers less than or equal to IE 6:

<!--[if lte IE 6]>
        <link rel="stylesheet" type="text/css" href="assets/css/ie6.css" />
<![endif]-->

Feed a specific stylesheet to IE 7:

<!--[if IE 7]>
        <link rel="stylesheet" type="text/css" href="assets/css/ie7.css" />
<![endif]-->

Feed a specific stylesheet to IE 7 or 8 (greater than or equal to IE 7):

<!--[if gte IE 7]>
        <link rel="stylesheet" type="text/css" href="assets/css/ie.css" />
<![endif]-->