some rules not loading from the style.css file

[Alec]

Hi,

I could not figure out, but some rules are not loading from the style.css in the Child Theme directory. But it is working fine when I copy the code to the customizer’s CSS / simple CSS.

Tried to deactivate the caching plugins, still no effect.

example (currently in the Simple CSS)
/*Disable box-shadow links on Novashare social buttons*/
.single .novashare-button a:not(.button):hover {
box-shadow: none;
}
.single .novashare-button a:not(.button) {
box-shadow: none;
}

https://aleckatzmusic.com/triads-in-jazz

or:
(currently in the Child’s style.css)

/*Woocommers Single product descripton font size*/
.woocommerce-product-details__short-description {
font-size: 17px;
color: #333;
}

https://aleckatzmusic.com/product/someday-my-prince-will-come/

====

Thank you,
Alec

GPP, GB, WPSP only, no Site Builders

[David]

Hi there,

i can see that child theme style on the front end – possibly browser caching – check in a Private/Incognito browser to check.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Alec]

Hi David, thanks for a quick response!

Yes, I know about the browser cache. I re-checked it in the private window of another browser. Still not working:

/*Woocommers Single product description font size*/
.woocommerce-product-details__short-description {
font-size: 17px;
color: #333;
}

https://aleckatzmusic.com/product/someday-my-prince-will-come/
or
https://aleckatzmusic.com/product/over-the-rainbow/

or this:

/*SIZE AND COLOR OF MOBILE MENU ICON*/
button.menu-toggle {
font-size: 24px;
color: #ff6200 !important;
padding-right: 35px !important;
}

Works only in the customizer’s Additional CSS

I’ve been experiencing this sometimes, so my solution is to keep the “problematic” certain CSS in the customizer to make it work for me or to add there !important. But I guess it is better to keep all in one file in the Child’s style.css for the performance.

The file seems to be ok (double-checked it)

[David]

Try adding this function to your site:

add_action( 'wp_enqueue_scripts', function() {
    wp_dequeue_style( 'generate-child' );
    wp_enqueue_style( 'generate-child' );
}, 99 );

This should load your child theme styles after Woocommerce.
We can then have a look at the non Woo CSS that you’re having issues with.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Alec]

Sorry, that did not have an effect…

[David]

Is the code still added to the site? Can you change the 99 to 150

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Alec]

Sorry, I had to go out for a couple of hours. Will doit as soon as I’ll get back.

Thanks for your help

[David]

No problem – let us know when you’re ready

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Alec]

Changed the value to 150 and it worked

Sorry, now I think I got it.

When checked again my css I’ve noticed I had to add .single-product here to apply white background and dark text for all Woocommerce & single products (just added here in bold text):

/*White Backgrounds for Posts, Woocommerce, cart, checkout*/
.single-post, .category, .tag, .woocommerce, .single-product, .page-id-1234 {
background-color: #fff;
}
.single-post .container, .category .container, .tag .container, .woocommerce .container, .single-product .container, .page-id-1234 .container {
background-color: #fff;
color: #333333;
}

Sorry, I was my fault…

Now everything seems to be fine and your code did the job.

Thank you very much

[David]

Glad to hear that!

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts