僅在 Chrome 上出現 iframe 高度問題

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

它對我有幫助（在Chrome和Moz.Firefox中工作）：

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

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

Answer 3

但是 iframe 調用了一個外部頁面。 我的解決方案中沒有此頁面。 我嘗試了一些 javascript 之類的

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