CODEWITHSUNDEEP
htmlcsswordpress
Reece
Reece

Reputation: 2701

Changing colour of active links individually in WordPress

I have a navigation menu where each link within it will be a different colour when active. I know you can usually do something like this: 

.side_bar_nav li.current-menu-item a{
    color: #ff6633;
}

But this gives each link the same colour when active I want to target each link individually and give it its own color. This is one of the links I want to target when active, I want to set its active colour to #336699.

 <li id="menu-item-49" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-9 current_page_item menu-item-49">
  <a href="http://fyberproperty.co.uk/">home</a>
</li>

Upvotes: 0

Views: 31

Answers (2)

Khadreal
Khadreal

Reputation: 731

Your code should work 

.side_bar_nav li.current-menu-item a{
  color: #ff6633;
}

But if this is giving the same color to all link. Are you sure the current link is not a parent menu item.

Upvotes: 1

Gerard
Gerard

Reputation: 15786

Since your li elements have a unique ID, you can use the following:

.page-id-9 #menu-item-49 a {
  color: red;
}

Upvotes: 1

Related Questions