CSS in Child Theme style.css not given priority

[Kyle Thomas]

Hi Tom,

I put all my custom CSS into the style.css file within my child theme, which are directly based off your child theme template.

Most of the CSS works fine and I have not issue and most of the time when I do it is my own error, but lately I’m running into the issue where a plugin’s CSS is of higher priority than my custom CSS. In other words, if I want to make a change to a plugin’s style I can’t even if I input the same style class with different parameters.

Without using !important is there a way to make my child theme CSS the highest priority?

Thanks

• This topic was modified 8 years ago by Kyle Thomas.

[Tom]

Hi Kyle,

This depends on where the plugin is enqueuing their stylesheets.

However, you might be able to force your stylesheet to load later by doing something like this: https://generatepress.com/forums/topic/load-child-theme-css-before-parent-stylesheet/#post-165194

Let me know 🙂

[Kyle Thomas]

I’ve tried the code you suggested in my child theme function.php file but I couldn’t get it to take affect. Not sure what I’m missing or doing wrong.

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

add_action( 'wp_enqueue_scripts', 'generate_move_scripts', 999 );
function generate_move_scripts() 
{
    if ( is_child_theme() ) :
        wp_enqueue_style( 'generate-child', get_stylesheet_uri(), true, filemtime( get_stylesheet_directory() . '/style.css' ), 'all' );
    endif;
}

Thanks for your help.

[Tom]

Any chance you can link me to your site?

[Kyle Thomas]

I’ve dealt with it a bit myself. I through my css for a specific plugin into a custom css area it had.

The staging site is: http://withmedia.yourdevsite.ca/atipp/

[Tom]

Looks like you have maintenance mode on.

[Kyle Thomas]

My bad, its now off for the time being.

[Tom]

Ah sorry, I must have missed it.

That code should be listing your child theme CSS quite late in the queue, so if a plugin is loading CSS after it, they’re most likely doing it wrong.

[Author]

Posts