callumacrae callumacrae - 9 months ago 84
Less Question

Using a variable in a selector in LESS

I have a variable

@index
and I want to output a selector so that when
@index
is
3
, the selector is
[data-sth="3"]
.

Longer example:

@index: 3;
/* selector here */ {
color: red;
}


Desired output:

[data-sth="3"] {
color: red;
}


I've tried a few things, but haven't managed to get anything that works, yet.

Thanks.

Answer Source

See Variable Interpolation. I.e.:

[data-sth="@{index}"] {
    color: red;
}

Original answer (Less versions before 1.40):

The following code should work:

(~'[data-sth="@{index}"]') { color: red; }

The ~ removes the quotation marks.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download