[css-cascade] How do Cascade Layers interact with !important
? · Issue #4971 · w3c/csswg-drafts (original) (raw)
This is in relation to #4470 custom-origin proposal, and Cascade 5.
The predefined origins are stacked such that important origins reverse the order of their normal counterparts:
- !important
- User Agent
- User
- Author
- normal
- Author
- User
- User Agent
Not Intertwined:
When adding custom origins (subset in the author origins), I think it’s clear that important and normal layers should remain the outer layer, rather than being subset layers within an origin:
- !important
- custom (?)
- custom (?)
- normal
- custom 2
- custom 1
Not:
- custom 2
- !important
- normal
- custom 1
- !important
- normal
The !important
flag is not meant for that kind of internal layering (we have specificity for that), but for balancing power between and across origins.
Reverse or maintain order?
It’s less clear if reverse-ordering should be maintained, or if that should be customizable. When origins are static and represent different concerns, the reversal ensures that lower origins can get final say when necessary. Since custom origins are not preset, and new origins could be added at either end, I think:
- Neither approach is dangerous. If a third-party framework provides both normal and important styles, I can work within either system to override what I want as an author. I can create origins below or above, and add
!important
flags in either case. Because of that, I’m also not sure there’s a strong need for user-customization of the important order, which would add both inconsistency between projects, and additional syntax. - Reversed order is consistent with existing origins. If custom origins worked the same way, it might help teach the concept. I'm not sure this approach has much else going for it in use-cases I've seen.
- Maintained order matches current author experience. Because author normal & important layers are side-by-side, authors rarely think about other origins, let alone reversal of important layers. Adding
!important
feels more like a linear change in specificity. This is much more likely expected behavior.