css3 - Background color of link not changing when hovered over twitter bootstrap's dropdown menu -
i using twitter bootstrap css. using .dropdown-toggle class display dropdown box when link hovered on.
i want main menu link have background color of white when hovering on dropdown box menu items. css using not work.
<nav class="navbar navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> <div class="nav-collapse collapse"> <span class="page-title" data-bind="text: router.activeitem().title"></span> <ul class="nav" data-bind="foreach: router.visibleroutes"> <li data-bind="css: { active: isactive}" class="navli"> <a data-bind="text: name" href="#" class="dropdown-toggle" data-toggle="dropdown"></a> <ul class="dropdown-menu qadropdown" data-bind="foreach: qasubmenus"> <li class="navli"> <a data-bind="attr: { href: '#/' + url }, text: name" href="#"></a> </li> </ul> </li> </ul> </div> </div> </div> </nav> .dropdown-menu > li > a:hover .dropdown-toggle{ background-color:white; }
adding css below solved problem:
.navli:hover .dropdown-toggle{ color:black; } .navli:hover { background-color:white; }
Comments
Post a Comment