悬停上的下拉菜单消失(使用引导程序) [英] Dropdown menu on hover dissapears (using bootstrap)

问题描述

我在引导程序的帮助下进行了导航.使用css，我制作了一个子菜单，该子菜单出现在悬停时.仅当我要单击子菜单中的标题时，该子菜单才会消失，然后才能单击它.

我已经阅读了其他必须在css中添加以下内容的线程:

  .dropdown:hover>.下拉式菜单 {显示:块； 

}

我添加了它，但仍然无法正常工作.我在做什么错了?

这是小提琴: http://jsfiddle.net/robin2609/buw4wc1t/

Gr.罗宾

解决方案

之所以会发生这种情况，是因为您的填充仅下降了 10px ，然后子菜单位于灰色之下.而您的填充内容尚未到达主菜单的末尾，因此当鼠标悬停时， .nav>&一个，它现在只是悬停在 .nav 上，而该子菜单无法保持打开子菜单.

更改填充:

.nav>&

收件人:

  .nav>&一种{填充:10px 13px 30px 13px;} 

正在工作的JSFiddle: http://jsfiddle.net/buw4wc1t/3/

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

解决方案

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/

这篇关于悬停上的下拉菜单消失(使用引导程序)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！