Less CSS IE targeting?

Question

What is the best way to target IE7, 8, etc. In LESS?

Is there a way to target them or should I ideally need to download a separate stylesheet?

Answer 1

As far as I know, LESS doesn’t allow you to target specific browsers, but only media sizes.

You need to do something like:

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

Answer 2

Using the IE orientation method in Paul Irish allows your IE rules to take full advantage of the nesting in your main smaller file. http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/

Answer 3

Using the Paul Ireland technique that Scott Simpson also linked, you can easily include target selectors right next to the rest of your CSS. For instance:

 div { display: inline-block; .ie-8 & { zoom: 1; display: inline; } } 

Compiled CSS will be as follows:

 div { display: inline-block; } .ie-8 div { display: inline; zoom: 1; } 

I believe this method is preferable to split style sheets, because it’s easier to keep track of your IE-specific CSS.