We help IT Professionals succeed at work.

When to edit .less file and when to edit .css file

lz7cjc asked
I have bought a template which has both a .css file and a .less file. I have been playing around with these since i want to change some colours and sometimes I have to change the .css and other times the .less. i have looked up documentation on this and it doesn't make a lot of sense. It says that it is a pre-processor - does this mean it then creates the .css?

Are there any rules I can follow as to whether I should be updating the .css or the .less? I am using trial and error at the moment which is taking forever so if I understood how they worked I would be much happier!

thanks for your help
Watch Question

Do you generate the .css file from the .less file using lessc (the less compiler) or some other tool?
Or are they unrelated files?


I don't know! They were supplied, as is... Perhaps that's the problem?  I've got pycharm, so can I compile using that?

If the css is compiled from the less file, presumably that means I only edit the less file?
Are the names of the files similar?  Like mydoc.css and mydoc.less

You can use the Less compiler lessc to convert .less to .css.
You can get it from this site: http://lesscss.org/


Yes they are both called style.xxx .So do I make changes to the .less and then compile? Might there be additional settings in .css that aren't covered in .less?
1. Yes.
2. You can make a copy of your .css file (e.g. styleOriginal.css) then run the less compiler. Compare the two .css files. If they are identical, the answer is no. I would expect the original and new .css files to be identical.


Ok thanks...I'll do that later. Is there any reason why the html references/includes both the .less and .css if one generates the other?
The developer may have done this for his convenience.
Using less.js in the browser is great for development, but it's not recommended for production


Thanks for your help...much clearer now :-)