Child theme CSS doesnt override parent theme CSS

  • Resolved logikdev

    (@logikdev)


    15 years, 10 months ago

    I’m trying to develop a child theme based on the default Twentyten theme. I created the child theme folder with the required style.css file with the proper “Template: twentyten” and @import lines.

    I can activate the child without any errors, but when i try to override some of the CSS rules, they just don’t seem to be taken into account.

    I was able to change the #wrapper and the #header padding, but anything else i’ve tried failed ( changing the main menu’s nav bar style for example ).

    I can’t seem to find any answers for this after a good google session.

    Any ideas?

    Thanks!

Viewing 4 replies - 1 through 4 (of 4 total)
  • Mark / t31os

    (@t31os_)

    15 years, 10 months ago

    For a quick fix you can use the important declaration.

    Eg.

    .mystyle { color: #fff!important; }

    Which should only fail if the style it’s attempting to over-ride has the important declaration to.

    Might just be an issue of placement in the stylesheet, try moving the style further down the stylesheet and see if that has an effect. Styles cascade, generally bottom most rules take priority, but there is more to it then that, IDs take priority over classes as one example.

    If you use Firefox you might want to consider installing Firebug, it’s really handy for checking things such as which styles are being applied to a given element.

    Thread Starter logikdev

    (@logikdev)

    15 years, 10 months ago

    Thanks for the reply. I’ve already tried the !important declaration without success. From Firebug, i just don’t see the child theme rules applied, only the parent’s!

    The part i don’t get is that i was able to make changes to the #header and #wrapper divs, but not anything else…

    I’ve only just begun creating this child theme, so my style.css file is almost empty…

    Thread Starter logikdev

    (@logikdev)

    15 years, 10 months ago

    Never mind… found the problem… There was a missing “}” in my child theme CSS which made all subsequent declarations invalid.

    I guess when you stare at it too long, you just don’t see these things anymore…

    Mark / t31os

    (@t31os_)

    15 years, 10 months ago

    Happy to hear you were able to solve your problem.. 🙂

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Child theme CSS doesnt override parent theme CSS’ is closed to new replies.