On my blog, I have different heading styles which I had defined in each post using HTML of the Wordpress Editor. Since one heading style appears frequently I would like to add a custom CSS class to my Wordpress child theme, to reduce the HTML in each post.

However, my approach doesn't work so far. I added the following code to the style.css of my child theme:

    h5 .audience {
                    text-align: right;
                    color: #ddd;

And in the HTML of an individual post:

 <h5 class="audience">Different heading

The outcome doesn't display any changes to the parent theme.

Apart from that, my child theme works fine. When I copy code from the parent theme style.css to the child theme style.css and change a parameter, such as the color, these changes are displayed. I even use the new WP_enqueue instead of the @import function to link parent and child theme.

How can I alter the CSS or HTML code so the custom class style changes are shown? Are any changes of the PHP code necessary?


Isn't is supposed to be h5.audience ? (period between the two, no spaces).

I always use the developer tools to look at the specific element, and the CSS panel will tell me the exact statement to use. I experiment in the CSS panel until I get the right 'look', then put the results of my experiments in the Child Theme CSS (or the Additional CSS of the theme).

  • Where do I find this CSS panel on the Wordpress Dashboard? – conpertura Aug 28 '17 at 10:05
  • The developer tools are built into most browsers. F12 might get you it. Ask the googles about 'developer tools' for your browser. – Rick Hellewell Aug 28 '17 at 17:47

Not the answer you're looking for? Browse other questions tagged or ask your own question.