Internet Explorer为垂直滚动条的宽度创建水平滚动条

Bor*_*ens 9 css xhtml internet-explorer

包含表的div具有以下CSS样式:

#formulaAlts {
    float: right;   
    height: 200px;
    overflow: auto;
}
Run Code Online (Sandbox Code Playgroud)

这使得当表格大于200px时,只会为表格显示滚动条,并且页面上的其他元素保持不变.大!

现在我们的朋友IE ...
在IE中,元素生成垂直滚动条而不增加包含元素.为了"解决"这个问题,创建了一个水平滚动条.
太糟糕了.而且我不想让它吮吸......

有任何想法吗?

--EDIT--
我发现了那条线

overflow-x: hidden;
Run Code Online (Sandbox Code Playgroud)

强制IE忽略水平滚动条.这是更好的..但不是那么,因为现在我的表的一部分是隐形的.

phi*_*yne 2

小心。

overflow-x
Run Code Online (Sandbox Code Playgroud)

不是最广泛支持的属性。

我倾向于使用带有一些正确填充的包含 div:

CSS:

div.scroll {
  overflow:auto;
  padding-right:6px;
  /* I've found 6px to be just right my purposes, but try others*/
}
Run Code Online (Sandbox Code Playgroud)

编辑:您需要在某处添加高度属性才能使其工作!我通常在 div.scroll 声明中设置默认值,然后针对特定情况(大多数情况)进行调整。HTML:

<div class="scroll" >
  <table>
  <!-- your table stuff in here -->
  </table>
</div>
Run Code Online (Sandbox Code Playgroud)