Google chrome 在Chrome中为调整大小的SVG元素强制回流DOM容器

请参见操作中的问题：

我在浮动的

div

中嵌入了一个SVG元素，类似这样：

<div style="float: left;">
    <svg width="50" height="20" id="svg1">           
    </svg>
</div>

…SVG可以正确调整大小，但其周围的框无法调整大小。正如您在JSFIDLE中所看到的，如果包含

div

的代码使用

display:inline块而不是float样式，则情况也是如此

奇怪的是，让我相信这是一个回流问题，而不是一个简单的布局问题，如果你检查Chrome控制台元素面板中的任何一个问题元素，那么
div
元素的大小就正确了。这个问题可能只适用于Google Chrome，我在Chrome OSX v.20.0.1132.57中看到了，但在Safari中没有看到。我没有参加过FF或IE考试

所以：如何在Chrome中强制回流？

我已经尝试了常见的怀疑，包括检查
div.offsetHeight
，
svg.getBBox（）
，以及其他几种变体。
听起来像是Chromium中的一个bug。当svg元素的固有宽度/高度更改时，布局宽度/高度不会自动更改。您可以手动设置布局宽度/高度：
.css（“宽度”，“50px”）
。你考虑过用铬来填充一个bug吗？
啊！我没有意识到设置css样式会在属性不起作用的地方起作用。看起来很有希望！
$('#svg2').attr('width', 50);