What can override !important?


The title says it all.

The article suggests that “once !important is used, it is very hard to override.”
So how can you override it?

We might be able to bump up the specificity, but that will take some experimenting.

<p style="font-variant: small-caps">A quick brown fox jumps over the lazy dog</p>

The style rule is near the bottom of the cascade. The only feasible way to override it is with !important on a P rule.

In the cascade, we can easily override the important rule by writing a new rule on the same selector, just further down. However, the style attribute comes back into play. It’s that rule we are trying to override.