Faking a css property with LESS (and replacing it with a real property on parse)

Question

Faking a css property with LESS (and replacing it with a real property on parse)

Let's say I want to create a "fake" (not browser-supported, such as { dimensions: 3; } ) css property with some arbitrary values and upon parsing it through LESS, want this fake css property to be replaced with any real css property (such as { background: red; }) -- does anyone know how something like this would be done?

javascript
css
node.js
less

Answer 1

Not entirly sure what you are trying to achieve here... My suggestion though would be to do something like this:

.dimension {
  background: red;
}

.realClassOne {
  font-size: 14px; /* some normal css */
  ...
  .dimension;  /* will apply all styles in dimension to this class */
}

I guess this is what you are looking for. Should work just fine.

You might also want to have a look at parametric mixins for more complex and powerful behavior (this is where less really comes to live!) http://lesscss.org/#-parametric-mixins