下拉菜单不可点击

我被我的下拉菜单卡住了。当我悬停一个菜单项时，出现一个下拉菜单，但我似乎无法点击下拉菜单项，因为下拉菜单与菜单之间有空白。下拉菜单不可点击

这是我的代码：

nav ul ul { 
display: none; 

} 

nav ul li:hover > ul { 
    display: block; 
} 


nav ul { 

float : right; 
padding: 0px 10px; 
list-style: none; 
position: relative; 
display: inline-table; 
} 
nav ul:after { 
    content: ""; clear: both; display: block; 
} 

nav ul li { 
    float: left; 
} 
    nav ul li:hover { 
     background: #fff; 

    } 
     nav ul li:hover a { 
      color: #000; 
     } 

    nav ul li a { 
     display: block; padding: 0px 10px; 
     color: #757575; text-decoration: none; 
    } 


nav ul ul { 
    background: #fff; padding: 0; 
    position: absolute; top: 100%; 
} 
    nav ul ul li { 
     float: none; 

     position: relative; 
    } 
     nav ul ul li a { 
      padding: 0px 20px; 
      color: #fff; 
     } 
      nav ul ul li a:hover { 
       background: #fff; 
      } 

nav ul ul ul { 
    position: absolute; left: 100%; top:0; 
}

没有任何人有一个想法？

，你可以看到在代码：http://dropdown.kiran.be

来源

2013-10-31 Kickar

你可以在CodePen或JSFiddle上发布你的代码吗？ CSS，HTML和JS –

只需添加左：0

你的资产净值UL UL（下拉菜单）并取出（从您的base.css继承一些保证金，如果您使用萤火虫，您可以看到发生了什么）

来源

2013-10-31 23:10:42 binboavetonik

基本上，你让当您悬停锂的UL出现：

HTML

<ul> 
    <li>one</li> 
    <li>two 
    <ul class="sub"> 
     <li>sub one</li> 
     <li>sub two</li> 
    </ul> 
    </li> 
</ul>

CSS

ul li ul { 
    display:none; 
    position:absolute;} 

ul li:hover ul.sub { 
    display:block; 
}

希望帮助！

来源

2013-10-31 23:20:57 peterchon

您应该删除您现在具有的ul余量。所以这是一个可能的解决方案：

ul li ul { 
    margin-left: 0; 
}

你甚至应该删除下拉菜单顶部的边距。我不能点击它，因为它滑走了！

来源

2013-10-31 23:39:42 Jules

下拉菜单不可点击

回答

相关问题