Child theme is not inheriting the main theme

Are you sure you’re not just missing the “@” symbol on your import?

Andrew, have you ever felt stupid before? Well, I just did! Thanks for helping me, really appreciate it. I really can’t believe, I forgot the @ symbol.

Thanks again,
Mark

I’m operating WordPress 3.8. I have windows 8 OS. I am using Mantra Theme 2.3.2.

I have created a child theme of Mantra, called mantra-child in it’s own folder. In the theme section, it displays Active:mantra-child. So WordPress is recognizing it. Below, is what it looks like in my mantra-child/style.css.

/*
* Theme Name: mantra-child
* Theme URI: https://uslowwebsite.com/mantra-child/
* Description: This is a custom child theme I have created.
* Author: Markea c/o uslowwebsite.com
* Author URI: https://uslowwebsite.com
*Template: mantra
* Version: 2.3.2
*/
@import url(‘../mantra/style.css’);
/*<link rel=”stylesheet” href=”../mantra/style.css”/>*/
<link rel=’stylesheet’ href=’css/output.css’/>

I have used “@import URL” and also “<link…>”, as shown above. I know that it’s more correct to use the <link> rather than the @import. To limit HTTP requests.

My problem is that when viewed in a browser, any browser, the styling is not there, just bare bones. This is all before, I customize it. For some reason it shows that the child theme is active in WordPress themes however, not in any browser.

I made an error, with not using the @ symbol and have corrected it. This was Andrew’s suggestion. However, styling is correct on Chrome only. All other major browsers, still rendering incorrectly. No styling at all. Not sure where to go to, from here.

You should not be using the <link... in there – it’s invalidating your CSS.

Thank you for your response.

I understand however, I have used (see below) and the problem still exist, as well.

@import url(‘../mantra/style.css’);
@import url(‘css/output.css’);

The idea with using the <link is to avoid multiple HTTP request. This suggestion, comes from Google. Less request means faster PageSpeeds. In any event, it still not working with the @import url.

Please note, after clearing Chrome’s cache it renders the same as the other browsers.

Turn off the caching on your site for now.

Still, no effect. ??

What’s in your Child Theme style.css file now?

It’s still showing as minified and I can’t really see what’s going on with a “coming soon” page up.

To clarify, is this the site you’re referring to: https://uslowwebsite.com/ ?

/*
* Theme Name: mantra-child
* Theme URI: https://uslowwebsite.com/mantra-child/
* Description: This is a custom child theme I have created.
* Author: Mark E Affsa c/o uslowwebsite.com
* Author URI: https://uslowwebsite.com
*Template: mantra
* Version: 2.3.2
*/
@import url(‘../mantra/style.css’);
@import url(‘css/output.css’);

Yes!

Have you modified the original theme?

Hi Andrew, no modifying to the original theme.

Please deactivate all plugins