Question

Since LESS is a pre-compile stylesheet language, this may not achieve what I’m after, but the idea is:

#sidebar {
     width: 40%;
 }

@sidebar_width : @('#sidebar:width');

.some_other_elements {
      width: @sidebar_width;
 }

So there are three questions I have:

1. Is something like the above possible? I just discovered LESS and the documentation is making me carsick.

2. If the above is possible, will it produce CSS with the .some_other_elements set to 40% or the actual width of the sidebar? Is it possible to get the actual width using LESS?

3. If you can give me your opinion of the library in general along with the answer or comment, I’d like to hear it. It seems a bit much but maybe it’s the next jquery and I need to adopt it sooner than later (or conversely, maybe it’s the next YUI and I should forget I ever saw it).

Answer 1

That won’t work. You can’t cherry pick out values from a selector and turn it into a variable: You would have to do something like:

@sidebar_width: 40%;
.some_other_elements {
  width: @sidebar_width;
} 

the width of the sidebar will be set to 40% of the width of the parent container.