Order of stylesheets in child theme

Question

Parent theme has following code for including styles.

function blue_planet_scripts() {
    wp_enqueue_style( 'blue-planet-style', get_stylesheet_uri() );
    wp_enqueue_style( 'blue-planet-style-bootstrap', get_template_directory_uri().'/css/bootstrap.min.css', false ,'3.0.0' );
    wp_enqueue_style( 'blue-planet-style-responsive', get_template_directory_uri().'/css/responsive.css', false ,'' ); 
}
add_action( 'wp_enqueue_scripts', 'blue_planet_scripts' );

In child theme I just imported parent theme's styles using

@import url("../blue-planet/style.css");

But order of stylesheets are:

• style.css (child theme)
• bootstrap.min.css
• responsive.css

What modification is needed in parent function to include child theme's style.css in last in the order? I need:

• bootstrap.min.css
• responsive.css
• style.css (child theme)

Answer 1

The function wp_enqueue_style has the param $deps for depends.

$deps (array) (optional) Array of handles of any stylesheet that this stylesheet depends on; stylesheets that must be loaded before this stylesheet. false if there are no dependencies. Default: array()

Use this param to define the dependencies and you have an order.

function blue_planet_scripts() {
    wp_enqueue_style( 'blue-planet-style', get_stylesheet_uri() );
    wp_enqueue_style( 'blue-planet-style-bootstrap', get_template_directory_uri().'/css/bootstrap.min.css', 'blue-planet-style' ,'3.0.0' );
    wp_enqueue_style( 'blue-planet-style-responsive', get_template_directory_uri().'/css/responsive.css', 'blue-planet-style-bootstrap','' ); 
}
add_action( 'wp_enqueue_scripts', 'blue_planet_scripts' );