So you’ve created this beautiful design and it works in the most up to date browsers (Firefox, Safari, Opera, Chrome) and then you look at that little runt in the family IE and your design looks like it’s been made by a 12 year old. You can’t just ignore it because 80% of your clientele use IE (Why do they still use it? Don’t ask.) That’s where IE conditional comments come in.

IE conditional comments are a way to selectively “comment out” any portion of your page in a way that only IE can interpret or the other way around.

Here’s a general example of what you would see in your code:

<!–[if (conditional) IE (version)]>
comments here
<![endif]–>

Conditional variables:

!        The “not” operator.
lt       The “less than” operator.
lte     The “less than or equal to” operator.
gt      The “greater than” operator.
gte    The “greater than or equal to” operator

example:

<!–[if lt IE 7]>
<link href=”style.css” rel=”stylesheet” type=”text/css” />
<![endif]–>

In this example style.css would be used on any browser less than IE7.

Filed under: Web Design, tutorials by Afarr