You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
We sometimes use !important to increase the specificity of some declarations made by utility classes. This has the advantage to help us override some styles set by MUI.
Not every utility class annotates its declarations with !important though. We currently have it for dimensions (u-w*, u-h*) but not for some display utility classes for example.
What is the rationale behind putting it on some declarations but not on others? Should we put !important everywhere? Or investigate other ways to increase specificity such as inline styles or @layer rules?
The text was updated successfully, but these errors were encountered:
PolariTOON
changed the title
Utility classes: which classes should have an annotation on their declaration?
Utility classes: which classes should have an !important annotation on their declaration?
Nov 9, 2022
Yes. We "cloned" what we have seen in bootstrap. And in bootstrap all utilities are !important. I think that tailwind was also in that case previously but seems to not use important anymore.
If you check the git history, you'll see that we had !important for all our utilities class, it was the main goal : being able to override any style :)
We sometimes use
!important
to increase the specificity of some declarations made by utility classes. This has the advantage to help us override some styles set by MUI.Not every utility class annotates its declarations with
!important
though. We currently have it for dimensions (u-w*
,u-h*
) but not for some display utility classes for example.What is the rationale behind putting it on some declarations but not on others? Should we put
!important
everywhere? Or investigate other ways to increase specificity such as inline styles or@layer
rules?The text was updated successfully, but these errors were encountered: