dimanche 19 avril 2015

Why I can't change color on hover of nav tabs

I have navigation created using nav tabs.


I wan't to set color on hover, but I can't


I tried this, but not working .



.tab2:hover {
background-color: green;
}

.tab3:hover {
background-color: green;
}


HTML



<div class="col-md-10">
<nav class="row">
<ul class="nav nav-tabs">
<li class="tab1"><a href="#"> <span class="glyphicon glyphicon-user"></span> Name &nbsp &nbsp<span class="glyphicon glyphicon-chevron-down"></span> </a></li>
<li class="tab1"><a href="#"><span class="glyphicon glyphicon-flag"></span>Text Link </a> </li>
<li class="tab1"><a href="#"> <span class="glyphicon glyphicon-envelope"></span> Message </a> </li>
<li class="tab1"><a href="#"> <span class="glyphicon glyphicon-oil"></span>10 </a> </li>
<li class="tab1"><a href="#"><span class="glyphicon glyphicon-asterisk"></span> &nbsp </a> </li>
<li class="tab1"><a href="#"><span class="glyphicon glyphicon-home"></span>&nbsp </a> </li>
<li class="tab2"><a href="#"> <span class="glyphicon glyphicon-chevron-down"></span> &nbsp &nbsp KATEGORIJE </a></li>
<li class="tab2"><a href="#">RADNJE</a></li>
<li class="tab2"><a href="#">VOZILA</a></li>
<li class="tab2"><a href="#">NEKRETNINE</a></li>
<li class="tab2"><a href="#">NAJNOVIJE</a></li>
<li class="tab2"><a href="#">HITNO</a></li>
<li class="tab2"><a href="#">USLUGE</a></li>
<li class="tab2"><a href="#"> &nbsp &nbsp &nbsp &nbsp<span class="glyphicon glyphicon-chevron-down"></span> &nbsp &nbsp OSTALI LINKOVI </a></li>
</ul>
</nav>
</div>


CSS



* {
margin: 0;
padding: 0;
}


.nav>li>a {
padding: 10px 3px;
font-weight: bold;
color:white;
font-size: 13px;
}
.tab1 {
background-color:#324255;
height: 42px;
}

.tab2 {
background-color:#405072;
height: 42px;
}
.tab3 {
background-color: #405072;
height:42px;

}
.nav-tabs li {
border-left: 1px solid #52617b;
border-right: 1px solid #52617b;

}

ul {
background-color: #405072;
height:43px;
}


.tab2:hover {
background-color: green;
}

.tab3:hover {
background-color: green;
}

Aucun commentaire:

Enregistrer un commentaire