How to enqueue style before style.css

Question

How do I enqueue a .css file before style.css is loaded? Or make the default style.css dependant on another .css file?

I'm trying to load a .css reset, which style.css would overwrite.

Here's what I have:

add_action('wp_enqueue_scripts', 'load_css_files');

function load_css_files() {
    wp_register_style( 'normalize', get_template_directory_uri() . '/css/normalize.css');
    wp_enqueue_style( 'normalize' );
}

However this is loaded after style.css.

Answer 1

Enqueue the style.css too, and set normalize as dependency:

if ( ! is_admin() )
{
    // Register early, so no on else can reserve that handle
    add_action( 'wp_loaded', function()
    {
        wp_register_style(
            'normalize',
            // parent theme
            get_template_directory_uri() . '/css/normalize.css'
        );
        wp_register_style(
            'theme_name',
            // current theme, might be the child theme
            get_stylesheet_uri(), [ 'normalize' ]
        );
    });
    add_action( 'wp_enqueue_scripts', function()
    {
        wp_enqueue_style( 'theme_name' );
    });
}

WordPress will load the dependencies now first automatically when theme_name is printed.