changing menu border color changed menu background

lauradawngreen · Member · Jan 27, 2012 at 6:43 am
Copy link

Add topic to favorites
Hi! I’m setting up my first blog using Pilcrow theme at http://prettydata.wordpress.com/.

I changed the menu colors to replace black with dark green, and to make the top border a different color than the bottom border. That seemed to go fine. But now, when on the Home page, the Home menu item doesn’t change to be dark green with white font – it stays white with dark green font. This only happens on the Home page. When I click on the other page in my blog (About), the ‘About’ changes to be white-on-green, like I want.

Here’s the menu code I changed:
```
#nav {
border:solid;
display:block;
float:left;
width:100%;
border-color:#D9106C #fff #4A8E3A;
border-width:1px 0 2px;
margin:0 auto;
}

#nav a {
color:#4A8E3A;
display:block;
line-height:42px;
letter-spacing:.1em;
text-decoration:none;
text-transform:uppercase;
padding:0 16px;
}

#nav ul ul a {
background:#4A8E3A;
color:#fff;
width:180px;
height:auto;
}

#nav .current_page_item a,#nav li:hover > a,#nav ul ul :hover > a {
background:#4A8E3A;
color:#fff;
}

#nav ul ul a:hover {
background:#4A8E3A;
}
```
Appreciate any help you can give, thanks!

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Jan 27, 2012 at 7:06 am
Copy link
That is because you changed the background color here.
```
#nav .current_page_item a, #nav li:hover > a, #nav ul ul *:hover > a {
    background: none repeat scroll 0 0 #4A8E3A;
    color: #FFFFFF;
}
```
Take the above rule completely out of your custom CSS.
lauradawngreen · Member · Jan 27, 2012 at 9:13 am
Copy link
I tried taking that rule out, but it didn’t help. Do you have any other suggestions?
thesacredpath · Member · Jan 27, 2012 at 9:17 am
Copy link
No you didn’t. It is still there. I can still see it in your custom CSS. You have specifically specified that the background for the menu tabs should be green.

Remove that from your CSS.
lauradawngreen · Member · Jan 27, 2012 at 11:04 pm
Copy link
I figured out that the error has nothing to do with me changing the menu colors. It appeared when I started using a custom menu. You can see now on my blog, I stripped out all the custom CSS code, and “Home” still does not switch to a black background when on the home page.

Any ideas about how to fix this? Thanks.
thesacredpath · Member · Jan 27, 2012 at 11:51 pm
Copy link
It’s black. I see it with my own eyes, and you NEVER took this out of your custom CSS. I told you you had to take this rule,
```
#nav .current_page_item a, #nav li:hover > a, #nav ul ul *:hover > a {
background: none repeat scroll 0 0 #4A8E3A;
color: #FFFFFF;
}
```
completely OUT of your CSS. Every time I visited your site it was still there. The above is what was causing the background of the menu items to be green.

No items found.