css expression causes less error

Question

I'm using LESS and I have to write this code

*zoom: expression(
    this.runtimeStyle.zoom="1",
    this.insertBefore(
        document.createElement("div"),
        this.childNodes[0]
    ).className="before",
    this.appendChild(
        document.createElement("div")
    ).className="after"
);

but it gives me Less syntax error. Could you help me?

Do you *need* to support IE 5 / 6 / 7, or can you simply replace this with styling for `:before` and `:after`? — Sean Vieira, Jul 18 '14 at 12:37
Less does not support vendor CSS syntax extensions like MS `expression`. You still can get anything in the output though by escaping not-supported symbols, but in this particular case it will be more simple to move such properties into a separate **css** file and include it into the main less file as `@import (inline) "ms-expressions.css";` (so that Less won't try to parse it at all and output "as is"). — seven-phases-max, Jul 18 '14 at 13:04
@seven-phases-max why do you add a comment here and not answer the question? now this question stays tagged as unanswered — Bass Jobsen, Aug 24 '14 at 21:15
@Bass Jobsen My bad, usually I'm lazy enough to not provide full details and nice formatting that would match an answer. I understand this is no good though, trying to remedy. — seven-phases-max, Aug 24 '14 at 21:51
@seven-phases-max, i understand. Thanks for your extra effort! Currently the stats tell me: 60% unanswered in the last 7 days for questions tagged with Less, which is bad for the reputation of Less as well. — Bass Jobsen, Aug 24 '14 at 22:15
@seven-phases-max: Bass is correct. That is why, I've started posting answers if the question is a *real* on-topic question and not some typo error etc. — Harry, Aug 24 '16 at 01:27

score 2 · Answer 1 · answered Aug 24 '14 at 21:53

Less does not support vendor CSS syntax extensions like MS expression. You still can get anything in the output though by escaping not-supported symbols, but in this particular case it will be more simple to move such properties into a separate css file and include it into your main less file with:

@import (inline) "ms-expressions.css";

This way Less will just inject its content "as is" w/o trying to parse anything inside.

css expression causes less error

1 Answers1