Question

我在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>

当我将身体方向从ltr更改为rtl时，父div的scrollWith会有所不同。 FireFox V25或Internet Explorer V10没有发生这种情况。

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

我的问题是如何使用css或javascript修复此问题？

Answer 1

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

Answer 2

在父div的CSS

上添加此内容

float:left

Chrome的scrollWidth在rtl和ltr方向上有所不同

2 个答案: