html - margin-left(以百分比设置)随着 Chrome 中的每个元素缩小(而不是在 Firefox 中)

Question

这里是 http://jsfiddle.net/6quT7/所以你可以看到在 Chrome 中查看时，每个 margin-left 是如何变小的，而在 Firefox 中查看时，每个元素的 margin-left 是相同的尺寸

这是 HTML:

<div class="group">
<div class="group_unit_first_child">
    <p>Hermelin</p>
</div>
<div class="group_unit color_green">
    <p>2</p>
</div>
<div class="group_unit color_blue">
    <p>2</p>
</div>
<div class="group_unit color_white">
    <p>8</p>
</div>
<div class="group_unit color_orange">
    <p>2</p>
</div>
</div>

这是 CSS:

.group_unit_first_child {
height: 100%;
width: 40.1%;
float: left;
background-color: #4e4e4e;
border-radius: 8px;
display: table;
}

.group_unit {
height: 100%;
width: 12.64%;
float: left;
text-align: center;
background-color: #4e4e4e;
border-radius: 8px;
margin-left: 0.96%;
display: table;

}

这个问题有什么办法解决吗？

谢谢!

Answer 1

从 .group_unit 中删除 display: table; 应该可以。

Fiddle