peteboere / css-crush

CSS preprocessor.
http://the-echoplex.net/csscrush
MIT License
537 stars 51 forks source link

Allow replacing sub values like transform within transition property #25

Closed DASPRiD closed 11 years ago

DASPRiD commented 12 years ago

This patch allows to replace sub values of properties with their vendor prefixed versions, for instance:

transition: transform 1s;

will be expanded to:

-moz-transition: -moz-transform 1s; -webkit-transition: -webkit-transform 1s; -ms-transition: -ms-transform 1s; -o-transition: -o-transform 1s; transition: transform 1s;

peteboere commented 12 years ago

Thanks for your code. The shortcoming with transition properties is definitely worth fixing.

biziclop commented 12 years ago

Maybe there could be a general solution, something like

-*-transition: -*-transform 1s;
DASPRiD commented 11 years ago

Any news about this?

peteboere commented 11 years ago

Hi,

The main problem with this is that browsers un-prefix properties at different times, so makes it unsafe to auto-prefix.

For example, presuming we want to turn this:

transition: .2s transform;

Into this:

-webkit-transition: .2s -webkit-transform;
transition: .2s transform;

In this scenario if webkit un-prefixes the transition property before it un-prefixes the transform property it would fall through to the second declaration and fail trying to understand the un-prefixed transform property.

The problem is compounded when you add the other vendors all of which drop their prefixes at different times.

Unfortunately, I think the only safe way to do this is manually using the transtion-property for better separation, or use the all keyword.

transition: .2s all;
transition-property: transform, -moz-transform, -webkit-transform;