Chrome、IE、Opera、Safari 上的 iFrame overflow-x BUG，但 Firefox 上没有

Question

我必须在 iFrame 中加载远程 url。远程内容将比 iFrame 宽一些。我不希望显示水平滚动条，但如果需要显示垂直滚动条。

我尝试了以下代码：

<iframe scrolling="auto" style="width:500px; height:300px; border:0; padding:0; margin:0; overflow-x:hidden; overflow-y:auto;" src="http://digg.com"></iframe> 

它可以在 Firefox 上运行，但不能在 IE、Chrome、Opera 上运行……这可能是一个错误或其他问题。 小提琴： http://jsfiddle.net/DpbUy/3/

---

我还尝试了在here 中标记为接受的答案中提供的 iFrame 的标签horizontalscrolling 和horizontalscrolling，但也没有运气。

<iframe scrolling="yes" horizontalscrolling="no" verticalscrolling="yes" style="width:500px; height:300px; border:0; padding:0; margin:0;" src="http://digg.com"></iframe> 

Th 在任何浏览器中都不起作用。

小提琴： http://jsfiddle.net/85q4r/

---

我知道我可以删除 iFrame 的滚动条并将其高度设置为 4000px 或其他内容，然后将其放入带有 overflow-x:hidden; overflow-y:auto; 的 div 中，但我想要一种更干净的方式。

---

我想知道我是否应该放弃这个并尝试另一种方法。谁能告诉我是否可以这样做？

Answer 1

要从 iframe 中删除水平滚动条，请对其应用此 css 规则：

iframe{
    overflow-x:hidden
}

您无需将其应用于 iframe 内容。