In all modern browsers, CSS rules declared with the !important
keyword take precedence over all other declarations, even including those made inside the element style
attribute.
Where in the CSS spec does it say it should override element style
attribute rules? I am trying to find it here but am not having any luck:
https://www.w3.org/TR/css-cascade-5/#importance
I really don’t like that it overrides element styles, and am wondering if this behavior was even in the specs to begin with.
3
Answers
Section 6.1, above the link you give. Origin and Importance comes before Element-Attached Styles
Right at the top of the section on the cascade sort
The very first entry is:
which includes all the
!important
rules.The third entry is:
This behavior is described with the sentence:
(emphasis mine)
Where an important declaration has
!important
at the end and:Source: https://www.w3.org/TR/css-cascade-5/#importance
If you don’t like that important styles have this trait, then don’t use them—find a way to override non-inline styles using the other precedence rules. Generally, I would recommend using important styles only when truly necessary (e.g. to override a style that is defined inline by a third party).