javascript - 当与 flex row-reverse 一起使用时，scrollWidth 返回 clientWidth 而不是实际的内容宽度

Question

请看这个插件:http://plnkr.co/edit/OXm4T2i0tw6UOEwaDSkx?p=preview

在 Chrome 中，容器 scrollWidth 值为 1616px(正确)。在 Firefox 和 IE11 中，它是 940px(容器本身的宽度，而不是内容的宽度)。

如果我将容器的 flex-direction 设置为 row 而不是 row-reverse，一切正常。

这是 Firefox 和 IE 中的错误吗？我该如何解决或解决这个问题？

谢谢。

Answer 1

作为变通方法，我在 FF 和 Edge 中成功地测试了它，我首先更改了 flex-direction 属性，读取值，然后重置属性。

Updated Plnkr

var container = document.querySelector('.container');
container.style.flexDirection = "row";
var temp = container.scrollWidth;
container.style.flexDirection = "row-reverse";
alert (temp + ' ' + container.scrollWidth);