Chrome 18 Border Bug

The bottom border on this box should be 10px wide, however in Chrome 18.0.1025.142 on OS X, the border displays at 60px wide and the text breaks to several lines far below the containing element.

by jeremyfrank

HTML

<div class="box">The bottom border on this box should be 10px wide, however in Chrome 18.0.1025.142 on OS X, the border displays at more than half the height of the box.</div>

CSS

body {
    padding: 20px;
    text-align: center;
}
.box {
    background: #ccc;
    border-bottom: 10px solid red;
    border-radius: 5px;
    padding: 20px;
}