html – iFrame 100%高度导致垂直滚动条

我看到很多关于100%高度iFrames的问题,但是没有人似乎有与我完全相同的问题.

我想做的是让iFrame覆盖整个视口,没有滚动条,没有设置overflow:隐藏在body上.

我得到一个5px的底边我的iFrame不会消失与css,它导致一个垂直的scroolbar.标准建议似乎是设置溢出:隐藏在身体上,但这不是真的解决问题,这对我来说还不够.

这是一个超级简单的jsFiddle example.(注意双垂直滚动条)

对于我来说,Chrome 15,IE9和FF9的行为是一样的.

它不是产生滚动条的iframe,它之后的空格

    <iframe src="http://www.bbc.co.uk" frameborder="0"></iframe>
    <!-- Whitespace here; This is being rendered! -->
</body>

如果你不想看到它,请使用

* { line-height: 0; }

编辑:如果删除空格,解决问题仍然存在,但解决方案是一样的.默认情况下,iframe作为内联元素呈现(iframe =’inline frame’),因此具有导致问题的行高.

或者,您可能想尝试iframe {display:block; }或两种解决方案的组合.

转载注明原文:html – iFrame 100%高度导致垂直滚动条 - 代码日志