Code reuse for browser inconsistencies.

[jaseemabid]

I have 3 line of code like this in my css.

-o-foo:foo;
-moz-foo:foo; 
-webkit-foo:foo; 

How is less going to help me ?

[leeoniya]

try any mixin library...like http://markdotto.com/bootstrap/ or http://snipplr.com/view/54946/

or roll your own.

[jaseemabid]

Is there a way to make a less variable a property itself and not just a propery value ?
Is this valid ?

.test (@prop) {
    @prop:red;
}
.test (color);  

Can we set text color red with this code ? If not, why cant we ?

[leeoniya]

i'm not sure if it would work, (i hope not). i can't think of a specific use-case when this kind of flexibility would be necessary and wouldn't lead to needlessly confusing code.

can you provide an example of scenario where you envision using this?

[jaseemabid]

-webkit-transform:rotate(-5deg); /* I hate this part :( Ugly browsers. */
-moz-transform:rotate(-5deg);
-o-transform:rotate(-5deg);

Is a usual code block seen in CSS files. Most of the advanced CSS is not implemented in a standard manner in browsers and needs 3 line of very similar code. Can we use less to improve this situation ?

[leeoniya]

the second link i posted has a rotate mixin that lets you do

#whatever {
  .rotate(-5);
}

which will handle all browsers.

[lukeapage]

duplicate of #36 (there is a pull request too)