将 html 元素设置为带标题的页面高度为 100%

Question

如何在具有固定高度标题的页面上将 html 元素设置为 100% 高度？当然，布局的高度不是固定的。

我已经将 html 和 body 设置为正确模拟 min-height: 100%。

---

我已经尝试过以下想法，但无济于事：

1.我使用了以下CSS，但它使用基于百分比的高度，这效果不佳，因为我的布局的标题是固定的81px高度。

#divContent
{
    height: 82%;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 82px;
    width: 950px;
}

2.我在填充和边距的各种组合中使用了以下内容，但它们都扩展了页面的高度（这是隐藏），从而使它们全部看起来一样：底部 81px 被隐藏。

html, body
{
    overflow: hidden;
    margin-bottom: 82px;
    padding-bottom: 82px;
}
#divContent
{
    height: 100%;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 82px;
    width: 950px;
    margin-bottom: 82px;
    padding-bottom: 82px;
}

我希望我的 divContent 消耗掉主体的所有高度减去 81px。

我知道如何立即使用表格来完成此操作，但这将是对表格的不当使用。我还认为它可以使用 jQuery 自动计算，但我以前没有写过这样的 jQuery。

PS我已经浏览了大约十几个问题，但找不到解决方案。如果您可以证明这是实际上涵盖同一问题的重复内容，我很乐意阅读另一篇文章。

Answer 1

将 div 的底部设置为 0px。这将扩展 div 以消耗页面的其余部分

#divContent
{

    margin: 0;
    padding: 0;
    position: absolute;
    top: 82px;
    bottom: 0px;   
    width: 950px;
}

这是我不久前回答的一个非常类似的问题

如何使用 CSS 构建此布局？