0
votes

I have a Wordpress menu with a drop down menu. The problem I'm having is when the parent page is highlighted, the below drop down items are also highlighted. This is a problem because the parent is highlighted with an image. The drop down menu needs to be highlighted with just a colours. It works fine when the parent page isn't the current page. Can anyone help with this?

#navbar li.current_page_item a {
    background:url(../images/activetab.png);
    width:95px;
    height:30px;    
}

#navbar li li.current_page_item a {
    background:#e9536c;
    font-size:12pt;
    width:150px;    
    color:black;    
}
3

3 Answers

2
votes

I'm pretty sure that your second selector is wrong. Try this code:

#navbar li.current_page_item a {
    background:url(../images/activetab.png);
    width:95px;
    height:30px;    
}

#navbar li.current_page_item li a,
#navbar li li.current_page_item a {
    background:#e9536c;
    font-size:12pt;
    width:150px;    
    color:black;    
}

This will target li's that are child elements of a current page item, and second(or more)-level li's that are current page items.

0
votes

Maybe you can try this

#navbar li li.current_page_item a {
background-image:none;
background:#e9536c;
font-size:12pt;
width:150px;    
color:black;   
}

This should disable the background image in your dropdown menu.

0
votes

Or use

background: #e9536c !important;

it will override your previous css style.