保持所有LI的边框高度相同

Question

我有一个带有嵌套UL的菜单。是否有一种只有CSS的方式才能让垂直边框保持最高设置菜单项的高度？请记住，这个菜单是动态的，所以宽度和高度都可以改变。

http://jsfiddle.net/simply_simpy/Kmyjr/

Answer 1

您可以删除float:left规则，并添加在display:table-cell规则。

jsFiddle example。

CSS：

#menu-secondary_menu > li { 
    border-left: 1px solid #7d7d7d; 
    display: table-cell; 
    font-size: 9px; 
    line-height: 16px; 
    text-transform: uppercase; 
    color: #7d7d7d; 
    padding: 0 10px 0; 
    margin: 0 10px 0; 
}