Добрый день!
Вот такой контейнер, нужно подсвечивать при :hover пункт меню и выпадающий список, при наеверении на выпадающий список нужно что бы подвечивалось название пункта меню который мы выбрали (а :active работает только при клике(( ). Пока подсвечиваю только background класса li-hover. когда дописываю цвет ссылки
.li-hover a:hover {color:#ccff33} результата 0.
Заранее большое спасибо всем за помощь и советы!
<div class="container" >
<div class="row header">
<div class="col-lg-2 col-md-2 col-xs-6">
<img src="images/logo.png" alt="logo" class="img-responsive">
</div>
<div class="col-lg-7 cold-md-12 col-xs-12">
<ul class="nav nav-pills menu-tittle">
<li class="dropdown li-hover">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
TVs
</a>
<ul class="dropdown-menu drop-header">
<li><a href="#">LED TVs</a></li>
<li><a href="#">LCD TVs</a></li>
<li><a href="#" style="border:none;">Plasma TVs</a></li>
</ul>
</li>
<li class="dropdown li-hover">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
Kitchen
</a>
<ul class="dropdown-menu drop-header">
<li><a href="#">link 1</a></li>
<li><a href="#">link 2</a></li>
<li><a href="#" style="border:none;">link 3</a></li>
</ul>
</li>
<li class="dropdown li-hover">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
Laundry
</a>
<ul class="dropdown-menu drop-header">
<li><a href="#">link 1</a></li>
<li><a href="#">link 2</a></li>
<li><a href="#" style="border:none;">link 3</a></li>
</ul>
</li>
<li class="dropdown li-hover">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
Bundles
</a>
<ul class="dropdown-menu drop-header">
<li><a href="#">link 1</a></li>
<li><a href="#">link 2</a></li>
<li><a href="#" style="border:none;">link 3</a></li>
</ul>
</li>
<li class="dropdown li-hover">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
Top Rentals
</a>
<ul class="dropdown-menu drop-header">
<li><a href="#">link 1</a></li>
<li><a href="#">link 2</a></li>
<li><a href="#" style="border:none;">link 3</a></li>
</ul>
</li>
<li class="dropdown li-hover">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
Why Rent?
</a>
<ul class="dropdown-menu drop-header">
<li><a href="#">link 1</a></li>
<li><a href="#">link 2</a></li>
<li><a href="#" style="border:none;">link 3</a></li>
</ul>
</li>
</ul>
</div>
<div class="col-lg-3 col-md-3 col-xs-6">
<ul class="nav nav-pills header-right">
<li class="dropdown li-hover-right">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
<span class="glyphicon glyphicon-search span-color"></span>
</a>
<ul class="dropdown-menu drop-header-right">
<span class="top-span-right">Search this website</span>
<div class="input-group">
<input type="text" class="header-input">
<span class="input-group-btn">
<button class="btn header-btn" type="button">search</button>
</span>
</div>
</ul>
</li>
<li class="li-hover-right">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
<span class="glyphicon glyphicon-shopping-cart span-color"></span> (0) in Cart
</a>
</li>
</ul>
</div>
</div>
</div>
