I have followed official and unofficial guides, and yet I simply cannot seem to be able to get certain styles in a child theme to overwrite its parents styles.
The only solution for me right now is to directly modify the main stylesheet, which is quite annoying as that gets overwritten every time there’s an update for said theme.
I know the child-sheet works as some styles I set there do get shown.
The theme I’m using is Twenty Thirteen with a custom child theme.
I only have the default WP plugins active.
WordPress core, themes and plugins are up-to-date.
In both Chrome and Firefox I see the style, it’s just ignored I guess.
I’m trying to change the background-color of the footer, I tried multiple selectors (ID, class, parent-child, element…
This may very well be something really simple I’m overseeing but I just can’t figure it out.
Thanks in advance.
PS: sorry if I sound frustrated (I am, lol)
After a lot of trial and error, I found a solution to my problem.
A classmate suggested trying to use the selector you get when inspecting the element (be it with Opera, Firefox or Chrome), instead of the same selector used in the main theme’s style.css.
I find this odd, as the child theme should overwrite the parent’s theme style anyway, right?
Either way, short solution: use a more specific selector than the one in the parent’s style.css.
I had the same problem and it was caused by Chrome caching the css. I renamed the style.css in the parent theme and refreshed my page and to my surprise nothing changed. Using F12 to inspect the element the styles section had a link to styles.css (even though I had renamed it) I was able to right click and open styles.css in a new tab.
The Ctrl-F5 shortcut clears the cache.
Doing this totally messed up my page because now it was not reading the parent style.css. Then all I had to do was rename it back and it correctly loaded it but also had the correct entries from the child style.css.
You might be able to just Ctrl-F5 (all the renaming bit was just exploration to force it not to load)