Child Theme Not Applying Custom CSS

[candidlyshanti]

Hi, I wanted to add custom css code to my main navigation menu and sidebar but it appears that my child theme is not reflecting the changes. Could there be something wrong with it?

[sharmstr]

Either your code is wrong or if you have caching enabled. Check your code or clear the cache.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[sharmstr]

You can also put it in Theme Options > General > quick css.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[candidlyshanti]

Hi, below is the code that I put in both the Child Theme Style.css and the the Quick Css
Code —–
.header-color .top-menu li > a, .header-color #top-social li a {
color: #ffffff !important;
}
.social-header {
background-color: black !important;
}
top-bar {
font-size: 16px;
}

#socket .container {
background-color: black;
color: #FFFFFF; /* default white color */
}
#socket .container {
float:left;
padding:15px 0;
min-width:100%;
}

.kleo-main-header {
height: 175px;
}

.navbar-header .logo {
padding-top: 13px;
padding-bottom: 25;
}

.collapse.navbar-collapse.nav-collapse.pull-right {
margin-top: 50px;
max-height: 80px;
}

It works when I put it in the quick css but not the the style.css I attempted to add css code to place a border around the navigation menu—->

.nav-container{
border:1px solid #e4e4e4;
border-bottom:5px solid #eaeced;
/*border-radius:2px;*/
position:relative;
height:47px;
width:auto;
}

but it doesn’t work no matter where you put the code. What am I doing wrong?

[candidlyshanti]

This is what my Child Theme style.css code looks like before I do anything to it:
/*
Theme Name: Kleo Child
Theme URI:
Description: Child theme for Kleo
Author: SeventhQueen
Author URI: http://seventhqueen.com
Template: kleo
Tags: one-column, two-columns, right-sidebar, fluid-layout, custom-menu, featured-images, post-formats, sticky-post, translation-ready
License: GNU General Public License
License URI: license.txt
*/

/*
* Please add your custom styles below
/*

So as instructed I place the code below where it says “Please add your custom styles below”

[sharmstr]

nav-container? The main menu container is .navbar-nav

Okay, silly question. Do you have the child theme active?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[candidlyshanti]

Yes the child theme is active, what would lead you to ask that?

[sharmstr]

Because it won’t process any files in /kleo-child/ if you don’t have it active

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[candidlyshanti]

Maybe there has been a miscommunication somewhere. I advised that I had the child theme active. I made a few changes in the Quick CSS that worked, but when I attempt to place the codes in the style.css where it advises they do not work.

[sharmstr]

I understood. No miscommunication. There have been plenty of people who think they have the child theme active but dont

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[candidlyshanti]

Is there a workaround or reason why neither the Quick CSS nor child style.css is taking the custom css codes? Is there a workaround because I am trying to build my blog and this theme is creating complications.

[sharmstr]

You said this is the one you can get to work, correct

“It works when I put it in the quick css but not the the style.css I attempted to add css code to place a border around the navigation menu—->

.nav-container{
border:1px solid #e4e4e4;
border-bottom:5px solid #eaeced;
/*border-radius:2px;*/
position:relative;
height:47px;
width:auto;
}
but it doesn’t work no matter where you put the code. What am I doing wrong?”

And I responded with “nav-container? The main menu container is .navbar-nav” So, did you try .navbar-nav?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[candidlyshanti]

No a previous code worked, not this code. When I changed it to what you stated it did not work. I’m confused at what support actually means for this theme because I see on various posts that adding code to the child theme does not work, but I have yet to see anyone address the issue. Since I am not able to make any changes nor use the theme in the manner that I believed I would be able to I will contact Themeforest for a refund. It makes no sense to have support when no one is addressing or answering the question that tons of people are having issues with.

[sharmstr]

Its usually a caching issue as I stated in my first response. I’d be more than happy to take a look. Please provide access.

I’ve posted almost 5000 responses here. I have yet to see anyone who had issues with using a child theme that wasn’t either a caching issue or plugin conflict.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[candidlyshanti]

I have cleared my cache and I don’t have any plugins other than the ones that the theme requires to download yet I cannot add css code to the child style.css file nor will any other code work in the Quick CSS box.

[sharmstr]

Again, I’ll be happy to take a look if you give me access.

Can you clarify what menu you are trying to put the border around. As I stated in my response, the selector I gave you is for the main menu. Did you want it for that or did you want it for the top menu, or perhaps the buddypress profile menu?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[candidlyshanti]

I am trying to put it around the main menu, but it doesn’t allow me to. The top menu I’ve already placed a background on it. I’m taking it that this particular theme is not blog/magazine friendly.

[sharmstr]

This is specifically for the main menu section.

COPY CODE

.collapse.navbar-collapse.nav-collapse {
  border: 1px solid #000 !important;
}

This is for the header which includes the logo and main menu

COPY CODE

.kleo-main-header.header-normal {
  border: 1px solid #000 !important;
}

This assumes you are using the default header layout. If you are using a different layout and the above code does not work, please provide a link.

If you want my assistance figuring out why the styles in your child theme are being ignored, I need admin access.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[candidlyshanti]

Are you able to provide a quick guide on how to check, just not comfortable letting someone into my dashboard without knowing how secure this site is.

[candidlyshanti]

What steps will I need to take?

This is what my child theme style.css looks like:

/*
Theme Name: Kleo Child
Theme URI:
Description: Child theme for Kleo
Author: SeventhQueen
Author URI: http://seventhqueen.com
Template: kleo
Tags: one-column, two-columns, right-sidebar, fluid-layout, custom-menu, featured-images, post-formats, sticky-post, translation-ready
License: GNU General Public License
License URI: license.txt
*/

/*
* Please add your custom styles below
/*

[sharmstr]

Add the codes below “please add your custom styles below”. This is not kleo specific. You do this with any child theme. The quick css section in theme options serves the same purpose.

But as you’ve said, you’ve tried adding the code there and it didnt work. So, I’d like to see why. Respond privately with credentials. You can create a temp admin account and delete it when we are done.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[sharmstr]

Its late here. I’ll come back to this in the morning.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[sharmstr]

Where are we at with this? Will you be giving me access?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

[Author]

Posts