I am customizing Mega Menu of Word Press.
Link is :- ,
http://totalebiz.exxelnet.sg/budgeting-business-planning-system/#
I want to change text color on hover of Blue background tab to white (Please see screenshot under http://74.81.85.18/~demourl/scshot/screen.html).
I am applying this css but by applying this, color change of whole menu:-
#mega_main_menu.primary > .menu_holder > .menu_inner > .nav_logo > .mobile_toggle > .mobile_button,
#mega_main_menu.primary > .menu_holder > .menu_inner > ul > li > .item_link,
#mega_main_menu.primary > .menu_holder > .menu_inner > ul > li > .item_link * {
color: #4C4C4C;
}
You need to specify which link you are referencing in the code. You can do this by adding the link ID to your CSS. You can add !important declarations to your code to make sure it overrides other CSS.
#mega_main_menu .menu_holder .menu_inner .mega_main_menu_ul li#menu-item-4306 a:hover span {color: #333 !important;} #mega_main_menu .menu_holder .menu_inner .mega_main_menu_ul li#menu-item-4306 a:hover {background: #FFF !important;}