Chrome scrollWidth 在 rtl 和 ltr 方向上是不同的答案

【问题标题】：Chrome scrollWidth is different on rtl and ltr directionChrome scrollWidth 在 rtl 和 ltr 方向上是不同的
【发布时间】：2014-01-16 12:38:42
【问题描述】：

我在 google chrome 上看到了一个错误。在Chrome V 31上运行下面的html代码

<!DOCTYPE html>
<html>
<head>
  <title>Chrome scrollWidth issue</title>
  <meta charset="utf-8">
</head>
<body style="direction: ltr;">
  <div style="overflow: auto; height: 100px; width: 800px; border: 1px solid red;">
    <div style="height: 150px; width: 1080px; background: blue;"></div>
  </div>
</body>
</html>

当我将 body 方向从 ltr 更改为 rtl 时，父 div 的 scrollWith 不同。这不会发生在 FireFox V25 或 Internet Explorer V10 上。

我在chrome issue tracker 上报告了这个问题。

我的问题是如何使用 css 或 javascript 解决这个问题？

【问题讨论】：

我重复了这个错误。有趣...我以前不在父 div 上。我很好奇……他们看起来和反应都一样……这给你带来了什么问题？
@Phlume 我们在我们的团队中使用 Sencha ExtJs，当它处于 rtl 模式时，我看到了调整网格组件大小的问题，然后我遇到了这是在计算列，最后我发现了这个错误在谷歌浏览器 v 31 上！
@OmidShariati 我也在使用 Chrome V 31 我不明白你的问题。它在我的机器上运行良好。

标签： javascript css google-chrome user-interface

【解决方案1】：

尝试在子元素中使用 clientWidth，你会在 rtl 和 ltr 中得到 1080，希望这是一个足够好的解决方案，直到他们修复 chrome 上的错误。

【讨论】：

【解决方案2】：

在父 div 的 CSS 上添加这个

float:left

【讨论】：