My Child Theme CSS Isn't Working

admin管理员组

文章数量:1431912

I have a child theme of the twenty seventeen theme. The problem i'm having is that my child theme css isn't working. I have checked the page source and the css file for my child theme is loading but doesn't seem to be overriding the parent theme css.

If I add the code into the theme additional css box it works. However when I put it into the child themes css file it doesn't.

I've read up on the correct way to enqueue child theme styles but it's all getting a bit confusing. The current code in my child theme's functions.php file is as follows.

    <?php
// Enqueue the parent and child theme stylesheets
if ( !function_exists( 'my_theme_enqueue_styles' ) ):
    function my_theme_enqueue_styles() {
        $parent_style = 'parent-style';
        wp_enqueue_style( $parent_style, get_parent_theme_file_uri( 'style.css' ) );
    }
endif;
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

// Enqueue child them js file
add_action( 'wp_enqueue_scripts', 'child_theme_js' );
function child_theme_js() {
  wp_enqueue_script( 'child-theme-js' , get_stylesheet_directory_uri() . '/child-theme-js.js' , array( 'twentyseventeen-global' ) , false , true );
}

Is there anything wrong with this code that you can see?

The page i'm working on is /

The page should have css to make it full width but it isn't working

Thanks for your help

Ali

I have a child theme of the twenty seventeen theme. The problem i'm having is that my child theme css isn't working. I have checked the page source and the css file for my child theme is loading but doesn't seem to be overriding the parent theme css.

If I add the code into the theme additional css box it works. However when I put it into the child themes css file it doesn't.

I've read up on the correct way to enqueue child theme styles but it's all getting a bit confusing. The current code in my child theme's functions.php file is as follows.

    <?php
// Enqueue the parent and child theme stylesheets
if ( !function_exists( 'my_theme_enqueue_styles' ) ):
    function my_theme_enqueue_styles() {
        $parent_style = 'parent-style';
        wp_enqueue_style( $parent_style, get_parent_theme_file_uri( 'style.css' ) );
    }
endif;
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

// Enqueue child them js file
add_action( 'wp_enqueue_scripts', 'child_theme_js' );
function child_theme_js() {
  wp_enqueue_script( 'child-theme-js' , get_stylesheet_directory_uri() . '/child-theme-js.js' , array( 'twentyseventeen-global' ) , false , true );
}

Is there anything wrong with this code that you can see?

The page i'm working on is https://dev.theartofsongs/about/

The page should have css to make it full width but it isn't working

Thanks for your help

Ali

• css
• child-theme
• wp-enqueue-style
• theme-twenty-seventeen

Share Improve this question asked Apr 16, 2019 at 16:26 alierrettalierrett 1122 bronze badges 4

• what CSS is supposed to make the page full width? It looks like its working to me. – RiddleMeThis Commented Apr 16, 2019 at 16:35
• You're targeting the wrong element. You've made #main full width but it's wrapped in a wrap class div that has a max width of 1000px – mrben522 Commented Apr 16, 2019 at 16:38
• Your CSS isn't specific enough: developer.mozilla/en-US/docs/Web/CSS/Specificity – Jacob Peattie Commented Apr 17, 2019 at 1:18
• This has changed since he originally asked – RiddleMeThis Commented Apr 17, 2019 at 13:49

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

You CSS is working and overriding the parent CSS. So its not an issue with the enqueue, that is all working fine.

I don't know what you want to make full width but you are currently targeting a div within the content. If you want to make the entire content area full width try adding something like this.

.wrap {
    max-width: 100%;
    padding-left: 3em;
    padding-right: 3em;
}

On a side note, if you use your browser's inspector by hitting f12 it makes debugging these types of things a breeze.

本文标签： My Child Theme CSS Isn39t Working