How does one nest only one level deep in LessCSS?

Question

I'm trying to do

li > a

with LessCSS nesting. Is this possible?

I initially thought maybe something like

li {
    > a {  }
}

But this didn't work. Any ideas?

Answer 1

It looks like that should work, but try adding an & just before the combinator:

li {
    & > a {  }
}

The LESS web site doesn't mention the use of & when nesting selectors with other combinators, but then again the documentation there isn't the best I've seen.

Answer 2

The LESS CSS website doesn't mention these things which is quite confusing. But all kinds of selectors actually work (even without the & sign). You can type any of the CSS selectors and they will compile properly:

p {
    > a { }
    + .class { }
    ~ #named { }
}

You need the & sign when writing rules for psedudo-classes/elements:

a {
    &:hover { }
    &:last-child { }
    &::before { }
}

Are you sure it's not working? Are you using the latest version of LESS?