LESS mix-in for nth-child?

Question

I\'m trying to make a LESS mixin that will give me this output:

.resource:nth-child(8n+1) { clear: left; }

I\'ve got this so far:

Answer 1

Less >= 1.4

you could do something like this:

.wrap-every(@n) {
  &:nth-child(@{n}n + 1) {
        clear: left;
    }
}

this should have the desired output. Without any hacks needed.

in older versins of Less

you can try simple string interpolation:

.wrap-every(@n) {
    @t: ~":nth-child(@{n}n + 1)";
    &@{t} {
        clear: left;
    }
}

and the output CSS in both cases should be something like this:

.resource:nth-child(8n + 1) {
  clear: left;
}