Child Theme's Stylesheet

Support
#1

Hi,

Why my X child theme (download form your site) CSS doesn’t work when I add that in the style.css. But adding in the Global CSS in theme options works. I would like to have my CSS in child theme.

How to make this work?

Thanks

#2

Hello There,

Thanks for writing in!

It is best that you understand the hierarchy of the styles being loaded in the theme.
The order is this:

  • X Theme’s stack style.css
  • X Child theme’s style.css
  • WordPress Customizer’s Additional CSS
  • X > Theme Options settings
  • X > Theme Options’ global css
  • Cornerstone’s page css

If you insert basic css in the child theme, most probably, your css were overwritten with the theme option settings which is why your code only worked in the theme options global css.

When placing a css in the child theme, you may use CSS Specificity (https://www.w3schools.com/css/css_specificity.asp). For example, instead of adding this:

element {
  // your styling here
}

When you add a css in your child theme, you use this instead:

.x-child-theme-active element {
  // your styling here
}

Hope this helps.

#3

Ok. Thank you! :thumbsup:

#4

You’re welcome.

#5

Hi again.

Is there anyway to load the child theme’s stylesheet at the end?

Thanks

#6

Hi @abdurrehman,

It depends on loading priority and the position of the CSS you wish to override. Plus, the generated CSS is applied through wp_head hook which is different than enqueue. Hence, it will be harder to add it to the end. I tried and have no luck. How about adding !important to your CSS styling for style.css?

Example,

element { color: pink !important; }

Thanks!

#7

I was thiking about this too but thought could suggest something else or any other way.

Anyway, thanks for your reply.

#8

Hi @abdurrehman,

The only workaround that I could suggest is using !important, because the only way to change its order is editing the theme core related to wp_head and enqueue. Though, any developer could edit the core but we can’t cover any issue resulted from the customization.

Thanks!

#9

Ok. Thank you!

#10

You’re welcome!

#11

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.