Css – Concatenate strings in Less


I think this is not possible, but I thought I ask in case there is a way. The idea is that I have a variable for path to web resource folder:

@root: "../img/";
@file: "test.css";
@url: @root@file;

.px {
    background-image: url(@url);

I get this as a result:

.px { background-image: url("../img/" "test.css"); }

But, I want the strings to combine into one string like this:

.px { background-image: url("../img/test.css"); }

Is it possible to concatenate strings together in Less?

Best Solution

Use Variable Interpolation:

@url: "@{root}@{file}";

Full code:

@root: "../img/";
@file: "test.css";

@url: "@{root}@{file}";

.px{ background-image: url(@url); }