在CSS水平导航栏

活跃li元素卸下底部边框我有一个横向导航（如下所示）：在CSS水平导航栏

horizontal nav

我试图消除在底边框的主动选择的李项，但由于某种原因，通常的做法似乎并不奏效。我试过申请margin-bottom: -1px;，但没有奏效。

这里有一个的jsfiddle我的CSS代码： http://jsfiddle.net/s5ynF/8/

欣赏任何帮助。

来源

2011-07-12 rolling stone

简单。

更新这些CSS选择器这样的：

ul.nav { 
    list-style: none; 
    margin: 0; 
    padding: 0; 
    padding-left: 25px; 
    border-bottom: 1px solid #E8E8E8; 
    height:25px; 
} 

#nav .home { 
    background-color: #FFF; 
    border: 1px solid #E8E8E8; 
    border-bottom: 1px solid #FFF; 
    margin-bottom: -1px; 
}

我删除了overflow:hidden;这就是为什么它不工作。然后，我将固定高度应用于.nav

来源

2011-07-12 00:18:00 brenjt

谢谢，这很好！快速跟进问题，活动li元素上的右侧和左侧边界现在延伸到ul的底部边界的下方（请参阅http://jsfiddle.net/s5ynF/9/）。解决这个问题的最好方法是什么？ –

@rolling stone尝试将'margin-bottom'改为-1px而不是-2px – brenjt

您将需要使用不同的清除修复方法，因为overflow: hidden是阻止其工作的原因。

我增加了一个明确的高度，并删除了overflow: hidden，它工作。

来源

2011-07-12 00:20:25 alex

在CSS水平导航栏

回答

相关问题