pesky nav bar color – changed child, but no results?

Code’s actually not very useful with CSS questions – can you post a link to your site.

EDIT – oh, sorry just saw the link. DUH! Looking at it.

And good job for making a child theme, BTW!

This is the site I’m currently working on.

Thank you!

It’s the background image in this:

#access {
    background: linear-gradient(#252525, #0A0A0A) repeat scroll 0 0 transparent;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    clear: both;
    display: block;
    float: left;
    margin: 0 auto 6px;
    width: 100%;
}

You should be able to override that by adding background to the #access (you already have most of this) in your child theme:

#access {
    background: none repeat scroll 0 0 #xxxxxx;
    clear: both;
    display: block;
    float: left;
    margin: 0 auto 6px;
    width: 100%;
}

The line at the top is a border on #branding so add the border-top to your:

#branding {
    background-color: transparent;
    padding-top: 262px;
    border-top: 0;
}

For the footer this:

#site-generator {
    background: none repeat scroll 0 0 transparent;
    border-top: 0;

WPYogi, Thank you!!!!
I’ve made those changes, and I’m happy to say they are (mainly) successes!

Can you please tell me what you would do about the shadow box that appears around the nav bar?
I have created a 0.5px #4db4e7 line below the bar which I want to keep, but I do not want the box.

Also, I would like the background to also be transparent when one hovers on the nav bar.
How should I do this?

Add box-shadow: none; to the #access CSS.

Add the background to this:

#access li:hover > a, #access a:focus {
    color: #4DB4E7;
    background: transparent;
}

The best way to work with these kinds of CSS issues is using Firebug – if you’re not already doing so, it’s really useful.

Thank you again!!!

I’m still not able to solve the nav bar hover background even after your last recommendation. I am seeing a white-to light gray gradient, but I’ve searched the file for “gradient” fields and changed them all to transparent, to no avail.

Also, I do have Firebug, but when I “inspect element” it shows me the html, not the css, and when I switch over to css it just starts from the top, not at the line with that direct element I’m inspecting. Perhaps I’m not using it properly??

Perhaps I’m not using it properly??

There’s another way to use it “Inspect with Firebug” which opens a panel at the bottom of the page — on the left portion of the panel is the HTML and the right side is the corresponding CSS. (At least that’s how it works on Macs — PCs may be different.) But Firebug’s site has tons of good info, so read through that for how to help.

This is the parent CSS for the menu background upon hover:

#access li:hover > a, #access a:focus {
    background: linear-gradient(#F9F9F9, #E5E5E5) repeat scroll 0 0 transparent;
    color: #373737;
}

One of the problems is that you seem to have a copy of the entire parent stylesheet in the child theme? That’s not really how child themes should be set up — it makes it much harder to keep track of the changes you’ve made and it creates a lot of duplicate CSS code… It may be too late to change that now, but FYI.

ah, yes, I wanted to keep the entire style sheet so that I could change the various components that are already outlined, but I am very new to CSS and child/parent themes so I’m sure there are smarter ways to go about reaching my goals for this site.

Again, thank you tremendously for your assistance. I will do my best to carry on from here.

It actually does not work quite that way. Keeping the stylesheet doesn’t help you change them — in fact, it’s making it much harder. The better way is to use Firebug to look at the existing styles using Firebug — and copy only that section of code to the child theme and change it there. Then that changed code will override the parent theme code. It will help you to learn a bit more about CSS — this is a good reference site:

https://www.w3schools.com/css/

Oh, and you’re more than welcome!