iframe内容在iOS上的iframe之外显示

这里是一个小提琴（jsfiddle.net/salman/RQBra/show/），演示了我面临的问题。 所有浏览器（包括适用于Windows的Safari 5）的iframe都按预期显示。 但是当我在两个iOS设备（iPad和iPhone）上查看页面时，iframe的内容溢出并覆盖了iframe右侧的整个区域。 以下是使用类似iframe的页面的屏幕截图：

我该如何解决这个问题？

Answer 1

嗯，尝试将div包裹在iframe中，但不要单独限制iframe的宽度和高度。

Answer 2

你可以修复它在一个div，但在iPhone上，它不会滚动没有一些JavaScript。 我做了一个小提琴，展示了如何修复iframe的大小。

http://jsfiddle.net/RQBra/29/

基本上，你包装你的iframe在一个包装，并给它一些CSS：

#wrapper { position:relative; z-index:1; width:400px; height:400px; overflow:scroll; } 

Answer 3

您的具体情况的解决方法是用<embed>元素replace<iframe> 。

 <embed src="..." type="text/html" width="400" height="400"></embed> 

它将在Safari Mobile上产生预期的效果，并将内容剪切到指定的width和height尺寸，而不是自动调整尺寸。 Hoeweverembedded不是专门为HTML内容devise的，当处理滚动， contentWindow和不同的环境（不一定是本地渲染）时，可能会产生不必要的效果，所以在使用它之前先对其进行testing。

W3C ：

该元素表示外部（通常是非HTML）应用程序或交互式内容的集成点。

Answer 4

我猜在Iframe里面有一个HTML文件，所以在HTML中包装内容在包装div

 #wrapper { position: relative; -webkit-tap-highlight-color: rgba(0,0,0,0); } 

它的大小将相对于HTML身体，比viewportSizes可能是你想第二行处理iframe点击闪烁，发生在ios'…