Child theme style.css in Wordpress cannot overwrite index.php file

Question

hope this helps. I created a child theme for my WordPress page and set up style.css and functions.php in it. I'm assuming the queue is set up correctly since I can change a few different things and it shows success. However, if I try to change something in index.php, it doesn't overwrite.

For example, I'm trying to change the color when the mouse is hovering over a link.

I've checked various other posts and documentation but nothing seems to help.

If my queue is in fact correct, any suggestions or confirmation would be greatly appreciated.

This is my style.css

/* Theme Name:   Blossom pin child
Theme URI:    https://www.diagnosischerry.co.uk
Description:  A blossom pin child theme 
Author:       Blossom Themes
Author URI:   https://blossomthemes.com/
Template:     blossom-pin
Version:      1.0.0
Text Domain:  blossom-pin-child
*/

.archive #primary .post .entry-header .category a {
    background: red!important;
}

.archive #primary .post .entry-header .category a:hover {
    background: red!important;
}

This is my functions.php

<?php
// enqueue parent styles

function blossompin_scripts() {
    wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css');
    wp_enqueue_style('child-style', get_stylesheet_uri() . '/style.css');
    }
    add_action('wp_enqueue_scripts', blossompin_scripts);

    
?>

edit: The queuing seems to be correct as I'm able to update the background of the text and some other text, but I'm having trouble pinpointing and changing the background color of the category links.

Below is the pink background I am referring to

The picture above is the picture during the inspection. If I change the color of the top from pink to red, it changes, but if I were to copy all of this and put it into my style.css, or just pick the parts that I think are relevant, then it Doesn't change the color, just keeps the pink color.

Thank you so much thunder

Answer 1

You are using the get_stylesheet_uri() function incorrectly and this is not a CSS related issue. If you check the definition of the get_stylesheet_uri() function, you can see that it returns the full URL

of the style.css file in the child theme directory

function get_stylesheet_uri() {
    $stylesheet_dir_uri = get_stylesheet_directory_uri();
    $stylesheet_uri     = $stylesheet_dir_uri . '/style.css';
    return apply_filters( 'stylesheet_uri', $stylesheet_uri, $stylesheet_dir_uri );
}

So, to put style.css into a child theme, you should use wp_enqueue_style('child-style', get_stylesheet_uri()); or wp_enqueue_style('child-style', get_stylesheet_directory_uri( ) .'/style.css');