CODEWITHSUNDEEP
csstwitter-bootstrap-3
atdev
atdev

Reputation: 529

Bootstrap 3 submenu parent highlight

Submenus were removed in Bootstrap 3. I added them back using this example/code: http://bootply.com/71520

The issue is the parent menu item does not stay highlighted as we hover over the submenu. How can this be accomplished? This used to work in bootstrap 2: http://getbootstrap.com/2.3.2/components.html#dropdowns

I tried looking all over the CSS and couldn't find this.

Upvotes: 1

Views: 1432

Answers (1)

davidpauljunior
davidpauljunior

Reputation: 8338

You need to add a new style to .dropdown-submenu:hover > a. Note, I copied the CSS from the existing styles on the a:hover.

.dropdown-submenu:hover > a {
    color: #fff;
    text-decoration: none;
    background-color: #357ebd;
    background-image: -webkit-gradient(linear,left 0,left 100%,from(#428bca),to(#357ebd));
    background-image: -webkit-linear-gradient(top,#428bca,0%,#357ebd,100%);
    background-image: -moz-linear-gradient(top,#428bca 0,#357ebd 100%);
    background-image: linear-gradient(to bottom,#428bca 0,#357ebd 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca',endColorstr='#ff357ebd',GradientType=0);
}

http://bootply.com/96695

Upvotes: 3

Related Questions