less-mixins

I'm trying to write a mixin, but I can't seem to get the arguments working the way I want: multiple properties are getting treated each as a separate argument. Current Code .transition(@property: all, @time: 1s, @timing: ease-in-out) { -moz-transition: @property @time @timing; -webkit-transition: @property @time @timing; -o-transition: @property @time @timing; transition: @property @time @timing; } a { .transition(color, opacity, .5s); } Desired Output a { -moz-transition: color, opacity .5s ease-in-out; -webkit-transition: color, opacity .5s ease-in-out; -o-transition: color, opacity .5s ease

How do I extend a Less class which is dynamically formed using & combinator? Less which generates expected output: .hello-world { color: red; } .foo { &:extend(.hello-world); font-size: 20px; } Expected CSS output: .hello-world, .foo { color: red; } .foo { font-size: 20px; } Less does not generate expected output: .hello { &-world { color: red; } } .foo { &:extend(.hello-world); font-size: 20px; } Unexpected CSS output: .hello-world { color: red; } .foo { font-size: 20px; } Extending a dynamically formed selector (loosely using the term) like that is currently not possible in Less. There is an

LESS allows parametric mixins, such as: .transition(@property, @duration){ transition: @property @duration; -moz-transition: @property @duration; /* Firefox 4 */ -webkit-transition: @property @duration; /* Safari and Chrome */ -o-transition: @property @duration; /* Opera */ } However, this doesn't always work with properties such as transitions. If you are trying to have multiple transitions and attempt to call the mixin multiple times, the last mixin overrides all previously defined transitions. That's because the proper CSS3 syntax for defining multiple transitions is: ... { transition: