Convert LESS nested CSS to standard CSS

Question

I need help trying to convert this LESS nested CSS to standard CSS. Can anybody help?

.leftNav {
    a.TopLevel {
        float:none;
    }

    ul#topnav {
             


        

Answer 1

Check Convert Less to CSS with Simpless

SimpLESS is your easy-to-use LESS CSS compiler.

Hopefully it will help you a lot..

Answer 2

you can also use lessphp or less.js.

Pekka is right. If you have a LESS style(s) (*.less file), it is also thought that you have a LESS-parser (original ruby gem or one of the PHP-Classes or even the less.js JavaScript lib) and its primary purpose is to parse (convert) LESS to CSS.

UPDATE

• WinLESS - (Windows) pretty simple GUI. It looks like it uses less.js somehow (my personal choise)
• SimpleLESS - (Multiplarform) another GUI. Work also pretty well
• LessAPP - (Mac) I think it is one of the first Desktop-Tool for comiping *.less Kind of Grandfather of WinLESS and SinpleLESS

There're many other tools...for Mac, for Win and Multi

Answer 3

This is the easiest way to use Less:

1. Create style.css file
2. Create style.less file

3. In index.php link to those file:

   <link rel="stylesheet" href="style.css">
   <link rel="stylesheet/less" type="text/css" href="style.less">
   

   Notice that to link to less you should end the rel="" with /less:

   rel="stylesheet/less".
   

4. download http://winless.org/

5. Drag your project folder to this program and it'll convert your less file to css.

Answer 4

using firebug, in the CSS tab, you can see what is the generated result in css using LESS.

Answer 5

You could use LessJS Converter

Answer 6

The whole point of LESS is that you write the LESS-style CSS, and the LESS interpreter converts it to normal CSS.

So just run your LESS code through LESS, and you'll get the equivalent normal CSS.

Simple.