内部有iframe 100%高度的衬垫

我的HTML文档中有一个iframe,我遇到了一些麻烦.

我还在页面顶部有一个URL栏(固定位置元素),当它们滚动时应该与用户保持一致.这很好.我希望iframe填充剩余的空间,但不会被URL栏覆盖.

这就是我所说的.http://s75582.gridserver.com/Ls

如何修复此问题,以便URL栏不会覆盖页面的一部分？当我尝试在体内设置填充时,它只会创建一个额外的,恼人的滚动条.

虽然你不能说CSS中的'高度:100%减去一些像素',你可以让iframe 100%高,然后使用填充将其自上而下.然后,您可以利用CSS3 box-sizing属性来从高度中减去填充.

这个:

    
    

    
    
foo

适用于IE8,Moz,Op,Saf,Chrome.你必须继续使用JavaScript回退来为不支持box-sizing的浏览器(特别是IE最多7个)使额外的滚动条消失.

它可以在没有任何Javascript的情况下完成,适用于IE7

CSS:

body {
    overflow-y: hidden;
}

#imagepgframe { 
    width: 100%;
    height: 100%;
    position: absolute;
}

#wrap { 
    width: 100%;
    position: absolute;
    top: 100px; 
    left: 0;
    bottom: 0;
}

HTML: