html - CSS for sub-menu on navigation bar not working -
i working on site , have created navigation bar sub-items not getting these sub-items display on hover. here's html , css code navigation bar:
<div class="collapse navbar-collapse" id="spi-primary-nav"> <ul class="nav navbar-nav"> <li id="menu-item-9265" class="home-link menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-9001 current_page_item menu-item-9265"> <a href="index.html">home</a> </li> <li id="menu-item-9004" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-9004 "> <a href="default.aspx">store</a> <ul> <li><a href="#">sub menu 1</a></li> <li><a href="#">sub menu 2</a></li> <li><a href="#">sub menu 3</a></li> </ul> </li> </ul> </div>
the css here:
.navbar-nav > li > ul { display: none; position: absolute; } .navbar-nav > li > ul:hover { display:block; }
here live link of site in case wants inspect elements using firebug: http://webcalendar.pcprosinc.com/home
please me out
you got :hover
in wrong place.
it should in li
instead of ul
try instead:
.navbar-nav > li:hover > ul { display:block; }
Comments
Post a Comment