Web_Designer
Web_Designer

Reputation: 74530

Different CSS output between less compilers

For a while, I used to compile my less using Sublime's less2css plugin, but more recently I've started using LiveReload* and I love it.

I noticed a difference between the CSS output depending on the compiler I used.


For the following LESS:

.gallery {
    margin-bottom: 1em;

    img {
        .wide-gallery& {
            width: 49%;

            &:nth-child(odd) {
                margin-right: 2%;
            }
        }
    }
}


LiveReload gave me the output I expected:

.gallery {
  margin-bottom: 1em;
}
.wide-gallery.gallery img {
  width: 49%;
}
.wide-gallery.gallery img:nth-child(odd) {
  margin-right: 2%;
}


...but my less2css plugin in sublime mismatched my selectors:

.gallery {
  margin-bottom: 1em;
}
.wide-gallery .gallery img {
  width: 49%;
}
.wide-gallery .gallery img :nth-child(odd) {
  margin-right: 2%;
}

Are the two compilers just using a different version of less? I'm not sure what's going on here.


*I'm using LiveReload v0.7.1.0 on Windows 8.

Upvotes: 1

Views: 284

Answers (1)

Daniel Ursu
Daniel Ursu

Reputation: 459

in my case, Crunch! did the job just fine http://crunchapp.net/

Upvotes: 1

Related Questions