Ng'esh Ng'esh - 2 months ago 10
CSS Question

Conditional comments for CSS class on html tag in Explorer

I am a beginner in web development and I need help from other experienced web developers. For compatibility issues with IE, I came across Paul Irish's Conditional comments but I am very green to it. Where does the code below go, after doctype html or in the head tag?

<!--[if lt IE 7]><html class="ie6"><![endif]-->
<!--[if IE 7]><html class="ie7"><![endif]-->
<!--[if IE 8]><html class="ie8"><![endif]-->
<!--[if IE 9]><html class="ie9"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html class=""><!--<[endif]-->

And what exactly is the code in those classes supposed to be with an example please.


The comment block is designed go in place of the html tag, so after the doctype declaration.


With that in mind- I would tend to urge you to not target IE or worse still, specific versions of IE in your CSS.

You should always strive to create a layout, (HTML and styles) which is(are) cross browser compatible, supporting progressive enhancement and graceful degradation. I appreciate this is not always terribly easy, but in increasingly complex sites it is a far better approach than attempting to specifically cater for differing versions of different browsers, instead of learning how to implement CSS/featuresets supported by all.

In the long run, especially if you are learning CSS- you will inevitably experience initial frustration but you will learn a lot more by not using conditional comments.

As noted in the comments on this answer, conditional comments are basically accepting you are, or will be, introducing error, and coding around it - the point is you should never accept you are introducing error in the first place but code to prevent it from arising at all. You should implement fault tolerance in your CSS by using styles and properties which gracefully degrade.