设置li的底部边框以覆盖ul-tab导航的底部边界

Question

您可以在这里看到右侧的li设置为'active'，因此根据需要，底部边框覆盖了ul的底部边框。 http://jsfiddle.net/6XTY2/但是，当我将左侧的li设置为“活动”时，它会将ul的下边框向下推，因此左侧li下面的边框不会被li的边框覆盖。我认为这是因为左李没有漂浮。 http://jsfiddle.net/6XTY2/1/但是，如果我浮动左李，那么div和ul的所有孩子都会浮动，这会导致其他问题。我怎样才能解决这个问题？

Answer 1

您可以添加一个负保证金：

#nav ul li.active a { 
    margin-bottom: -2px; 
} 

但是，你将不得不撤消了第二个功能：

#nav ul li.active.nav-secondary a { 
    margin-bottom: 0; 
} 

Answer 2

另一种选择：

#nav ul li a { 
    border: 1px solid #dcdcdc; 
    margin-bottom:-1px; 
} 

#nav ul li.active a { 
    border-bottom-color:#F6F6F4; 
} 

你基本上只是在这一点上改变边界底色。