css - Display:table 扩展了 div 的高度。解决方案？

Question

我有这个html显示 2 条的序列。因为在第一个 div 中我显示了一个内联列表，所以我想使用它，display:table因为这样看起来更好。问题是它扩展了 div，使它变大了 20px（并将另一个 div 移动到更低的位置）。

<div class="top-bar></div>
<div class="tail-bar></div>

.top-bar{       
    width: 520px;
    height: 50px;
    dispaly: table;
    background-color: #FFFFFF;  
}

编辑：我添加了一个 JSFiddle http://jsfiddle.net/eCYUT/2/

这是没有display:table标签的版本

Answer 1

ul元素与元素之间的间隙div实际上是与ul元素相关的边距。

要删除它，margin-bottom: 0px请指定 ul 元素的类名。

ul.stats{
    margin-bottom: 0px;
    /* other css properties */
}