Compass Trans Mixin

Question

Ich habe folgende CSS:

.progress-bar { 
    transform: rotate(0deg) scale(1) skew(-50deg) translate(2px); 
    -webkit-transform: rotate(0deg) scale(1) skew(-50deg) translate(2px); 
    -moz-transform: rotate(0deg) scale(1) skew(-50deg) translate(2px); 
    -o-transform: rotate(0deg) scale(1) skew(-50deg) translate(2px); 
    -ms-transform: rotate(0deg) scale(1) skew(-50deg) translate(2px); 
} 

... und möchte dies mit dem Compass Transform mixin Refactoring.

Es gibt keine Beispiele in der Dokumentation, also versuchte ich dies als ein Schuss im Dunkeln:

.progress-bar { 
    @include transform (0deg, 1, -50deg, 2px); 
} 

... und diese Fehlermeldung erhalten:

Syntax error: Mixin transform takes 2 arguments but 4 were passed. 

Gibt es eine Möglichkeit zu Mach das mit Compass Transform?

Answer 1

Sie müssen angeben, welche Transformationen durch Leerzeichen getrennt verwendet werden sollen. zB:

@include transform(rotate(-135deg) skew(-10deg, -10deg)); 

Answer 2

Ich glaube, es sollte eine durch Leerzeichen getrennte Liste von Transformationen statt durch Komma getrennt sein.

.progress-bar { 
    @include transform (rotate(0deg) scale(1) skew(-50deg) translate(2px)); 
}