CODEWITHSUNDEEP
cssbackground-colornav
Doug Fir
Doug Fir

Reputation: 21204

Nav menu li background when active

I know that this should be simple but cannot "get it"

I have a navigation where when a menu item is hovered the background becomes orange and the text white.

I'd like to apply this to the active page too but am not having any joy.

Here is the code:

.dropdown ul li.active,
.dropdown ul li:hover,
.dropdown ul li.on {
    background-color: orange;
    opacity:0.4;
}

and

.dropdown ul li:hover,.dropdown ul li:active,.dropdown ul li:hover a {
  color: white;
  background: orange;
}

I think that that's all the relevant code, the site is here incase anyone thinks I've missed something tinyurl.com/m562wgd

Upvotes: 0

Views: 77

Answers (1)

Jeroen W
Jeroen W

Reputation: 872

There's no class active defined in your html.

Use

.dropdown ul li.current_page_item,
.dropdown ul li:hover,
.dropdown ul li.on {
    background-color: orange;
    opacity:0.4;
}

.dropdown ul li.current_page_item a {
    color:#fff;
}

instead :)

Upvotes: 1

Related Questions