WordPress.org

Ready to get started?Download WordPress

Forums

Can't find overriding style (2 posts)

  1. SarahBernier
    Member
    Posted 2 years ago #

    I am trying to change the color of my h3 headings. I have already changed it on style.css. However, it's not working.

    When I view the pages with firebug, the primary style applied is:

    h1, h2, h3, h4, h5, h6, h2 a, h3 a, h4 a, h5 a, h6 a {
    color: #000000 !important;}

    But I can't figure out where it's coming from! (the page is http://baseball-insider.com/baseball-instruction/first-base/first-base-positioning-for-relays/ if you want to look. The h3 is the subheading just below the page title.

    For the source of the style, firebug just gives me the page url.

    I'm so confused. Any ideas?

    Sarah

  2. peredur
    Member
    Posted 2 years ago #

    I may be mistaken, but I think what Firebug is saying is that the style is actually in the generated HTML. And, indeed, if you look at the HTML source for the page you will see this:

    <style type="text/css">
    
       ...
    
        h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #; }
    
        ...
    
    </style>

    I think that's what's doing it. I'm imagining that color: #; equates to color: #000000;, although I haven't seen that before. It's also not marked as !important so I'm having some doubts, although it could just be an artifact of Firebug to show the style as !important in this situation... I don't know.

    As for overriding it... The rules for overriding styles marked !important (if this one really is) are not entirely clear to me especially if the style marked in this way is in the HTML file and therefore later in the cascade than anything in an external stylesheet.

    Obviously, if the above really is the correct bit of style definition, you can change it. If it isn't, and you can't, I'd try creating a more specific style rule and seeing if that takes precedence. If it doesn't, I'd mark the more specific rule as !important to see if that works.

    If all else fails, you could try writing a more specific, !important style rule actually in the template file after all the other style blocks or even on the element. But we're getting desperate here.

    And finally, the <h3> tag itself has an invalid class attribute. It says:

    <h3 class=\"redTextHeader\">

    This is reported as an error by the w3c validator. Looks to me as though a PHP programmer has escaped something unnecessarily.

    There are some other HTML errors reported by the validator as well, that I'd take a look at if it was mine. They look easy to correct.

    HTH

    PAE

Topic Closed

This topic has been closed to new replies.

About this Topic