html - Custom navbar color when hovering under Bootstrap -

i fail find right css syntax custom navbar links when hovering. navbar follows:

  <ul class="nav navbar-nav navbar-right">     <li><%= link_to "home", root_path %></li>       <li class="dropdown">         <a href="#" class="dropdown-toggle" data-toggle="dropdown">           account | <span class="caret"></span>         </a>         <ul class="dropdown-menu">           <li><%= link_to "user", current_user %></li>           <li><%= link_to "update", edit_user_path(current_user) %></li>         </ul>     <li><%= link_to "logout", logout_path, method: "delete" %></li> 

i manage correct hovering effect on dropdown menu with

.dropdown:hover { background:#3b3535; color: #ece6e6; } 

i want have same effect on links "home" , "logout". tried

.navbar-nav:hover { background:#3b3535; color: #ece6e6; } 

but 3 links ("home", "account" , "logout") hovered @ once. since have tried numerous options including:

.ul#navbar-nav a:hover { background:#3b3535; color: #ece6e6; }  .navbar-nav ul.nav li:hover a{ background:#3b3535; color: #ece6e6; }  .ul.nav li a:hover { background:#3b3535; color: #ece6e6; } 

but none of them seems work. give me appropriate syntax have correct hovering effect? thanks.

there no link <a> home , logout use below targeting them both.

ul.nav li:hover {   background:#3b3535;   color: #ece6e6; } 

and ul not class have dot before selector :)