摆脱子菜单中的边框底部

我的导航中的活动链接有一个border-bottom: 1px solid #424242，但我不想在下拉菜单中有border-bottom。正如您在鼠标悬停下拉菜单时看到的那样，链接跳转。我一直在尝试，但我找不到解决方案。可能是我不得不重构HTML。我很困惑！任何帮助？这是我的fiddle。谢谢。摆脱子菜单中的边框底部

来源

2015-09-19 Labanino

您可以将您的代码..？ – CodeRomeos

你可以添加一些代码。如果没有它，不可能告诉你哪个元素在你的CSS中定位。 –

@ CodeRomeos，@Destination Designs已经做到了！抱歉。 – Labanino

您需要从删除.top-bar-section ul li a:hover：

.top-bar-section ul li a:hover, .top-bar-section li.active:not(.has-form) a:not(.button), .top-bar-section li.active:not(.has-form) a:not(.button):hover { 
    color: #424242; 
    background-color: #f3f4f6; 
    background: #f3f4f6; 
    border-bottom: 2px solid #424242; 
}

DEMO

编辑：

更好的解决方案是只在子列表中删除边框。

.top-bar-section ul ul a:hover { 
    border-bottom: none; 
}

这是一个可能的解决方案，以应对跳跃：

.top-bar-section > ul > li > a { 
    border-bottom: 2px solid transparent; 
}

DEMO2

来源

2015-09-19 21:38:04 lmgonzalves

他要求有没有边框的子菜单，因为脚本丢失，您无法在他提供的小提琴中看到该子菜单，但它在代码中。 –

我把它作为答案发布，因为他想知道它！ – lmgonzalves

是啊，这是有点不清楚，他的意思是“子菜单”我猜。在他的演示中，你没有看到孩子UL –

从它的外观有子菜单项没有边框，它会看起来好像这会工作。在你拨弄你不能看到的潜艇，但代码是有他们如此：

.top-bar-section .has-dropdown li > a { 
    border-bottom: none; 
}

来源

2015-09-19 21:37:35

摆脱子菜单中的边框底部

回答

相关问题