Question

<div id="outerDiv">
    <div id="innerDiv"></div>
    <div id="remainderDiv"></div>
</div>

#outerDiv, #innerDiv, #remainderDiv{
    height: 100px;
}
#outerDiv{
    width: 55.5px;
    z-index: 1;
    background-color: red;
}
#innerDiv{
    width: calc(100% - 10px);
    z-index: 100;
    background-color: blue;
    float: left;
}
#remainderDiv{
    width: 10px;
    z-index: 100;
    background-color: green;
    float: left;
}

http://jsfiddle.net/yz8cwj3a/

结果：http://i.imgur.com/DYor2yb.png

这个小提示显示Chrome 37的问题。对具有小数像素的元素使用calc（100％ - 10px）函数，它总是向下舍入。这会导致奇怪的事情。

在示例中，外部div的宽度为50.5px。两个内部div具有calc（100％ - 10px）和10px作为宽度。尽管总数应该是50.5，但它仍然显示红色背景。

问题似乎是在Chome 37中引入的。有没有人知道这个问题是否已被报道和/或是否会被解决？

编辑：我从评论中了解到该问题已经存在了很长时间。有没有（跨浏览器）整洁的方法来解决这个问题？