The Ease of Moving to LESS
posted under category: CSS on September 6, 2011 by Nathan
You are not as far from using LESS CSS as you may think. What does it take to switch from plain CSS to LESS? It's 2 steps.
- Rename your .css file to a .less file
- Include less.js
That's it! From there, you can start to add some variables and nest your selectors, or get more advanced with mixins and color functions. Oh, and also my favorite thing in the world, the
// single line comment!There are a few cases where your stylesheet won't convert perfectly. I've noticed just a few. They are:
- Font sizes with a slash for a combined font-size / line-height, LESS tends to divide; the fix is to escape them, surround some or all of it with ~"tilde quotes"
- Missing semicolons and sloppy CSS won't compile in LESS; it won't validate either, so you should clean it up anyway
- IE-specific transformation filters and similar unofficial fringe CSS rules, escape the entire thing with the tilde quotes