How do I change font-size of something that already has "font-size: 0.9em !important" on it?? Is there another way to change the font size indirectly using font
or another property? I ask because I have an external CSS and I can't modify it directly.

- 26,262
- 56
- 178
- 334
-
2This might help you: http://stackoverflow.com/questions/11178673/how-to-override-important – Avinor Jun 25 '13 at 20:32
-
beautiful. worked perfectly. – bigpotato Jun 25 '13 at 20:37
4 Answers
As long as your external CSS is loaded after the original stylesheet containing the !important
property, you should be able to override it by using !important
again and making sure the selector is AS or MORE specific than the original one.
For example if you originally had:
#main p {
font-size: 0.9em !important;
}
you should be able to override like this:
#main .content-area p {
font-size: 0.9em !important;
}
If it's more specific than the original it should work whether or not it's before or after the original, but if it is equally specific the override needs to be last. I'm not certain but I think also applying !important
to an inline style may override it as well.
You may need to read up on specificity to understand this but in general terms an #ID is more specific than a .class and a .class is more specific than an element (e.g. p
).

- 10,102
- 3
- 35
- 42
You can added another important rule after the original important, or define a more specific css rule to override the original
// less important
table {
// xxx !important
}
// more important
#id table {
// xxx !important
}

- 16,278
- 7
- 48
- 74
Can you add a JavaScript file to your page? You can override it when the pag e loads that way.

- 1,122
- 14
- 32