0

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.

bigpotato
  • 26,262
  • 56
  • 178
  • 334

4 Answers4

3

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).

Ennui
  • 10,102
  • 3
  • 35
  • 42
1

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
}
Huangism
  • 16,278
  • 7
  • 48
  • 74
0

Can you add a JavaScript file to your page? You can override it when the pag e loads that way.

Doug Steinberg
  • 1,122
  • 14
  • 32
0

Here is an article worth reading on points/weighting and CSS specificity:

http://css-tricks.com/specifics-on-css-specificity/

TestShoot
  • 42
  • 4