css - Overwrite Bootstrap Navbar Dropdown Menu Colors with LESS? -


i don't find way use custom background colors both dropdown-toggle , dropdown-menu of bootstrap sidebar less css. works fine in pure css, when using less, can't work. want achieve this:

http://jsfiddle.net/gqvm2/6/

my less code bit here:

.navbar-default {   .navbar-nav {     > open {       > a,       > a:hover,       > a:focus {         @media (min-width: @grid-float-breakpoint) {           background-color: #aaaaaa;         }       }       > .dropdown-menu {         @media (min-width: @grid-float-breakpoint) {           background-color: #aaaaaa;         }       }     }   } } 

the above code not override bootstrap less (i suppose) should. css used in jsfiddle, works fine though.

i'm pretty new less, excuse me if stupid mistake. when inspect generated css in chrome developer tools, above not show (i'm using less javascript parser development).

thanks help!

first: have mispelled selector.... open should .open:

.navbar-default {   .navbar-nav {     > open { // here it's problem!       > a,       > a:hover,       > a:focus {         @media (min-width: @grid-float-breakpoint) {           background-color: #aaaaaa;         }       }       > .dropdown-menu {         @media (min-width: @grid-float-breakpoint) {           background-color: #aaaaaa;         }       }     }   } } 

secondly: there better ways of customizing bootstrap. have lots of variables allow change how build like. , navbar dropdown no exception.

you can customize changing variables @navbar-default-link-active-bg , @navbar-default-link-active-color.


Comments

Popular posts from this blog

c++ - CryptStringToBinary API behavior -

c++ - Correct method for redrawing a layered window -

java.util.scanner - How to read and add only numbers to array from a text file -