CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
user2314339
user2314339

Reputation: 393

Dropdown menu on hover dissapears (using bootstrap)

I made a navigation with the help of bootstrap. With css i made a submenu that appears on hover. Only when i want to click a title in the submenu, the submenu dissapears before i can click it.

I have read on other threads that i have to add the following to the css:

.dropdown:hover  > .dropdown-menu {
display: block;

}

I added it, but it's still not working. What am i doing wrong?

This is the fiddle: http://jsfiddle.net/robin2609/buw4wc1t/

Gr. Robin

Upvotes: 2

Views: 85

Answers (1)

Simply Craig
Simply Craig

Reputation: 1114

This happens because you have your padding only going down 10px and then your submenu is below the gray. while your padding does not reach the end of the main menu and therefore when the hover comes off the .nav > li > a it is now hovering just .nav which doesn't keep the sub menu open.

Change padding in:

.nav > li > a

to:

.nav > li > a
{
    padding: 10px 13px 30px 13px;
}

Working JSFiddle: http://jsfiddle.net/buw4wc1t/3/

Upvotes: 1

Related Questions