Home/ Questions/Q 767141
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-14T17:09:46+00:00

Skip to bottom for question, but first, a little context. So I have been

  • 0

Skip to bottom for question, but first, a little context.

So I have been looking into CSS compilers (like Sass & Less) for a while, and have been really interested in them, not because they help me understand anything easier (I’ve been doing css for a couple of years now) but rather they cut down on cruft and help me see things easier.

I recently have been looking into reliably implementing inline-block (and clearfix), which require lots of extraneous code & hacks. Now according to all the authorities in the field, I shouldn’t put IE hacks in the same page I do my CSS in, I should make them conditional. But for me that is a really big hassle to go through and manage all this additional code, which is why I really like things like Less. Instead of applying unsemantic classes, you specify a mixin and apply it once, and you’re all set.

So I guess I got a little of the track (I wanted to explain my points) but bascially, I’m at the point where these CSS compilers are very useful for me, and allow me to abstract a lot of the cruft away, and reliably apply them once and then just compile it. I would like to have a way to be able to compile IE specific styles into their own conditional files (ala Less / Sass) so I don’t have to deal with managing 2 files for no reason.

Does anything like a script/applcation that runs and can make underscore / star hacks apart of their own file exist?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    It’s not really a compiler trick, but if you want to use conditional comments without having to compile separate per-browser stylesheets, you can simply use HTML conditional comments to inject a styling hook. For example:

        ...
</head>
<!--[if lte IE 6]><body class="ie6 ie7"><![endif]-->
<!--[if lte IE 7]><body class="ie7"><![endif]-->
<!--[if gte IE 8]><!--><body><!--<![endif]-->

    Now you can target rules you want to apply to IE<=6 and IE<=7 in the same stylesheet as the rest of the rules:

    body.ie6 #thing { position: relative; }
body.ie7 #otherthing { z-index: 0; }

    This is IMO marginally cleaner than the * html hack, which is the last acceptable CSS hack. (The “star hack” and “underscore hack” are invalid CSS: avoid.)

    • 0