Tagged: conflict, custom.css
Hello folks.
I installed the Google Typography plugin because I need a more granular approach to the text styling in a site.
It “usually” runs ok but some markups (not all) are overridden somehwere.
E.g. in Google typography H2 is set @ 47px, color #908070.
The output is the correct font, correct size, but wrong color (#222222)
Even if I enter the same parameter in the custom CSS I still get the wrong result.
Hovever my other basic styles work ok with a combination of the plugin + added styling (e.g. word-wrap, line-heigth) being declared in the custom CSS.
So basically what I’m trying to understand is the stylesheet hierarchy… which sheet overrides what and when?
Appreciate your help, as always
Paul
Hey UncleGroOve!
Thank you for using the theme!
It’s not actually being overwritten by the theme’s stylesheets. I think the problem lies on the use of the selector. You need to use the theme’s proper css selector. If you want to target the h2 tags, the theme uses different selector to apply the color for it. Another set of selector to modify the text styling, size, variation etc.
.alternate_color h2, .main_color h2 {
color: red;
}
Use google inspect element or firebug to find the proper css selector.
Cheers!
Ismael
<icon=”faceplant” class=”idiot”>
:-|
</icon>
apologies… yes it was so obvious grrr…
Ciao
Paul