Question

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

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

我尝试了以下想法，但无济于事：

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

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

2。我在填充和边距的各种组合中使用了以下内容，但它们都扩展了页面的高度（hidden），从而使它们全部看起来一样：底部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。

P.S。我查看了大约十二个问题，找不到解决方案。如果你能证明这是一个实际上涵盖同一问题的副本，我很乐意阅读其他帖子。

Answer 1

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

#divContent
{

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

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

How to build this layout with CSS?

将html元素设置为具有标题的页面上具有100％高度

1 个答案: