Less CSS - class declaration in html?

Question

I get where less could be used, but doing this (which doesn't work):

<div class="fixed-width(150px)" ></div>

.fixed-width(@customWidth) {
   width: @customWidth;
}

...seems like it makes more sense than the offered example of:

<div class="fixed-width" ></div>

.fixed-width {
   .another-step(150px);
}

.another-step(@customWidth) {
   width: @customWidth;
}

Is there an easy way to accomplish this I'm missing?

Maybe it makes more sense to you. It doesn't to me. Less CSS is about making stylesheets easier to maintain. It's not about getting itself involved with your HTML. — simshaun
– simshaun, Commented Sep 14, 2011 at 22:18
@Frank: This would make everything harder to maintain, IMO. Classes should denote what type of object the element is, not what look it has. — You
– You, Commented Sep 14, 2011 at 22:24
Whatever solution that does this would have to either pre-parse your HTML (not easily done when you involve dynamically generated HTML from server-side languages) and generate a stylesheet accordingly or parse it at run-time and generate/cache & append a stylesheet. For simple examples such as the one you provided, you may as well just use style="width: 150px". Anyway, it's out of the scope of Less CSS. — simshaun
– simshaun, Commented Sep 14, 2011 at 22:25
I hate that style tag! Harder to maintain, You? Maybe that's relative. I just think it makes sense to be able to declare classes with variables, like almost every other language :) Too bad, though. — user375566
– user375566, Commented Sep 14, 2011 at 22:29

Eric · Accepted Answer · 2011-09-14 22:19:49Z

3

No. LESS compiles the CSS file only, not the inline CSS as well. You'd have to write an improved parser to generate the code you're already using.

answered Sep 14, 2011 at 22:19

Eric

98.1k54 gold badges257 silver badges389 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

There is no inline CSS involved either, making the given HTML completely irrelevant to LESS.