[Resolved] Capturing custom css into style.css in a child theme.

[Bradley]

Hello,

I have used the “custom styles” in the customizer to get styling set up for my child theme but when I add it to the child themes style.css it is not taking effect. I am missing something?

Brad

[Tom]

So you’re writing it in the Customizer, then copying it (and not saving it), then adding it to your child style.css file?

[Bradley]

Lol,

I just checked and yes, I am saving it into the child theme’s style.css. Interesting thing is this is a style for a plugin. When i set it in the customizer it sticks but not in the child themes style.css

B

[Tom]

It’s likely the plugin’s CSS is running after the child theme CSS, but not the Customizer CSS.

Easy fix is to make your custom CSS selectors more specific than the ones you’re overwriting in the plugin.

[Bradley]

ok,

Can’t I somehow load my css from somewhere else? where is the customizer css loading?

I un-minified the plugins css but I can’t even find the selector I modified in it. I think it is in their sass somewhere. OR it’s .js . Over my head I am afraid.

I worked out how to output their junk into flex containers. This one thing is eluding me.

I haven’t even gotten to the sass or js yet.

[Tom]

I believe the Customizer CSS adds to the bottom of wp_head, which is why it takes priority over other CSS loaded in that area.

Your child theme will load the CSS after the parent theme CSS so it takes priority over that, but can’t predict where plugins will load their CSS files.

If you just make your CSS more specific, it will work.

If you currently have this:

.my-selector {}

Try this:

body .my-selector {}

[Bradley]

Tom,

As always thanks alot on this. That did it.

Bradley

[Tom]

You’re welcome 🙂

[Author]

Posts