What’s worse than spending a week coding a brand new design to realize that your site looks like a bloody mess in IE6? Luckily we have a valid way to fix these problems without having to use hacks in our CSS and destroy the completed design that looks good in all other browsers.
IE Conditionals are an easy and awesome (and valid!!) way to insert any IE specific styles* into your code. You can specify styles for just IE6, just IE7 or for both. Not only that you can specifiy styles to affect all versions of IE below any version number. (*actually these conditionals can be used for anything that you want to display to IE specifically)
For example, say you have some margin adjustments to make that effect only IE6, in the head of your HMTL document you could put this:
Or, say you need it to affect IE6 and all previous versions:
The above code tells the browser to apply these styles to IE6 and any version LESS THAN it.
You can also use the and/or syntax (& / |) if you need the styles just applied to certain versions:
You can also use the & symbol to combine styles for one browser ex: [if (IE 6) & (IE 5)].
If you have a substantial amount of styles (or aren’t using a templating system where the header is isolated) I recommend using the conditional to link to a seperate IE stylesheet:
See more examples and the complete variable list over at Microsoft’s Developer Network.
