What's the best way to target IE7, 8 etc. in LESS?
Is there a method to target them or would I ideally need to load a separate style sheet?
Thanks for your help!
What's the best way to target IE7, 8 etc. in LESS?
Is there a method to target them or would I ideally need to load a separate style sheet?
Thanks for your help!
As far as I know, LESS doesn't allow you to target specific browsers, only media sizes.
You'll need to do something like:
<!--[if IE]>
<link rel="stylesheet/less" type="text/css" href="ie.less" />
<![endif]-->
Using Paul Irish's method of IE targeting allows your IE rules to take full advantage of nesting in your main less file. http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
Using Paul Irish's technique that Scott Simpson linked too, you can very easily include targeted selectors right beside the rest of your CSS. For example:
div {
display: inline-block;
.ie-8 & {
zoom: 1;
display: inline;
}
}
Your compiled CSS will then be:
div { display: inline-block; }
.ie-8 div { display: inline; zoom: 1; }
I find this technique preferable to separate stylesheets because it's easier to keep track of your IE-specific CSS.