REJH REJH - 1 month ago 5
Less Question

Less css: 'calc(x+y)' outputs 'calc(z)' instead of just 'z'

I have the following css rule:

@somevar = 8px
.someclass { width: calc(8px + @somevar); }

After processing (lessc 2.7.1) it outputs:

.someclass { width: calc(16px); }

But the 'calc()' operation is ignored by older browsers and it's obviously not needed here because there is nothing to be calculated.

So how do I get it to output

.someclass { width: 16px; }


If you don't want calc to appear in your output, don't include it in the input.

As pointed out in comments, calc is not needed for the less compiler, it's a css function.

So this will work:

.someclass { width: 16px + @somevar; }


.someclass { width: 32px; }