Question

我在Chrome上遇到iframe高度问题。所有其他常见的浏览器，如IE，Opera，Safari和FF都可以。

<iframe runat="server" id="ifTest" name="ifTest" frameborder="0" height="790px" width="960px" style="position:inherit;"></iframe>

在所有浏览器中都可以正常使用，但在Chrome中，页脚底部会出现一个大的空白区域，位于页脚之后。如果我在iframe中删除高度，iframe将会很小但页脚底部没有大的空白区域。

任何人都可以帮助我吗？

Answer 1

尝试

iframe#ifTest{
   width:960px;
   height:790px;
}

并从iframe代码中删除宽度和高度

Answer 2

但是iframe会调用异域页面。我的解决方案中没有此页面。我试过像

这样的javascript

function resizeFrame(f) { f.style.height = f.contentWindow.document.body.scrollHeight + "px"; }

Answer 3

这对我的情况有帮助（在 Chrome ＆amp; Moz.Firefox 中工作）：

iframe {
    height:100vh; // without it doesn't works
    width: 100%;
    overflow:hidden;
}

<iframe frameborder="0" name="iframe_article"></iframe>

仅在Chrome上使用iframe高度问题

3 个答案: