Javascript 浮动元素的子元素未在Chrome/Safari中重新定位

我有一个页面，页面右下角有一些元素，我在chrome和safari中遇到了一个奇怪的问题，浮动元素的子元素在删除一些浮动元素后没有重新定位

在OSX上，它似乎在Firefox和Opera中运行良好，但Chrome和Safari只重新定位浮动元素，而不是子元素。在inspector中切换某些属性将重置它，因此它可能是一个渲染错误。是什么引起的和/或如何避免

html:

来自的修复为我修复了它：

.float {
    -webkit-transform: scale3d(1,1,1);
}

与我在回答中所说的类似，这似乎也是一个WebKit渲染错误

我还说“我不确定这个修正案是否有任何负面影响”，同样的道理仍然适用，但这个答案现在已经有一年多了，有+20/-0票，没有负面评论，所以我想没问题

#container {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
.float {
    width: 100px;
    float: right;
    height: 100%;
    margin-right: 1em;
}
.box {
    width: 100px;
    bottom: 0;
    height: 100px;
    position: absolute;
}

.float {
    -webkit-transform: scale3d(1,1,1);
}