Using variable name for selector in less

less

Solution

Yes, this can be done

This works in LESS 1.3.1+. You can vary the string, but this is simply an example of one way it could be done:

LESS

@selector1: ~'#master';
@selector2: ~'@{selector1} #leftcontent';
@selector3: ~'@{selector1} #rightcontent';

@{selector2} div,
@{selector3} div { 
   background-color: #fff; 
}

@{selector2} a,
@{selector3} a { 
   color: blue; 
}

CSS Output is exactly as you show in the question.

Problem

Is there a way to use a variable name to store the selector and use it? ``` #master #leftcontent div, #master #rightcontent div{ background-color: #fff; } #master #leftcontent a, #master #rightcontent a{ color:blue; } ``` Is it possible to store #master #leftcontent in a variable and refer it

Original source