css - box-sizing: 边框框在 safari 中有点古怪？

Question

这段代码：

<div class="green">
    <div class="red" style="height: 25%"></div> * 4
</div>

.red {
    border-top: 1px solid black;
    box-sizing: border-box;
}

...在 IE8、Chrome 24 和 Firefox 18 中看起来不错：

但是在 Safari (5.1.7) 中，我得到了一些多余的底部边距/透明边框：

jsbin 上的完整测试代码：http: //jsbin.com/ozefar/6/edit

我在我的css中遗漏了什么吗？