[transitions][cascade] CSS Transitions, animations and the cascade.

According to the cascade, transitions take highest priority:

http://www.w3.org/TR/css-cascade-3/#cascading <http://www.w3.org/TR/css-cascade-3/#cascading>
Origin and Importance
The origin of a declaration is based on where it comes from and its importance is whether or not it is declared !important (see below). The precedence of the various origins is, in descending order:
1. Transition declarations [CSS3-TRANSITIONS]
2. Important user agent declarations
3. Important user declarations
4. Important override declarations [DOM-LEVEL-2-STYLE]
5. Important author declarations
6. Animation declarations [CSS3-ANIMATIONS]

In implementations, we’ve already seen that browsers allow animated property values to override !important: (example at http://estelle.github.io/doyouknowcss/files/importantanimation.html <http://estelle.github.io/doyouknowcss/files/importantanimation.html>)

Reading the transition spec, it states:

"Implementations must add this value to the cascade if and only if that property is not currently undergoing a CSS Animation ([CSS3-ANIMATIONS] <https://drafts.csswg.org/css-transitions-1/#biblio-css3-animations>) on the same element.” - https://drafts.csswg.org/css-transitions-1/#application <https://drafts.csswg.org/css-transitions-1/#application>

Which indicates to me that animation should take precedence over transitions. 

Am I missing something? Can someone clarify.  Thanks.


-Estelle 

Estelle Weyl
estelle@weyl.org
http://www.standardista.com

Received on Thursday, 24 September 2015 02:29:32 UTC