CSS：iFrame填充屏幕的其余部分，而不是由具有恒定大小的div填充

Question

[解决]

所以我的页面顶部有一个恒定高度的div，我希望在它下面有一个iFrame填满页面的其余部分。谷歌图片和LinkedIn做了类似的事情

请参阅：http://www.linkedin.com/share?viewLink=&sid=s420444224&url=http%3A%2F%2Flnkd%2Ein%2FcnjYt4&urlhash=ZGYM&pk=nprofile-view-success&pp=1&poster=22330283&uid=5484658853024890880&trk=NUS_UNIU_SHARE-title）。

这是我现在拥有的CSS代码：

#header {
  height: 60px;
  float: top;
  position: absolute;
}
#iframe {
  margin-top:61px;
  float: bottom;
  position: absolute;
}

此外，在HTML中，我将iFrame设为99％宽度和90％高度。

但这不太好用。我只希望iFrame有滚动条，但是当我开始减小窗口大小时，它的一部分变得隐藏（几乎没有）。结果，出现第二组滚动条。顺便说一句，这是我在尝试解决问题时提到的前一个问题：CSS two divs next to each other

有谁知道如何重新创建LinkedIn在CSS中的功能？

Answer 1

我通常会使用javascript。

使用jquery库，您可以以非常简单的方式执行以下操作。

$().ready(function() {
        $('#iFrame').height($(window).height() - 62);
    });


$(window).resize(function() {
        $('#iFrame').height($(window).height() - 62);
    });