Question

我正在尝试使一个绝对定位元素占据body的100％高度，其中body设置为占用100％的内容，可能超过window高度。但是，我似乎无法指出它。

CSS：

html
{
    height: 100%;
}

body
{
    min-height: 100%;
}

#push
{
    padding-top: <to exceed window height>;
}

#absolute
{
    position: absolute;

    left: 0px;
    top: 0px;

    width: 100%; /* to take full width of body */

    height: 100%; /* to take full height of body */
}

HTML（假设这是<body>中的所有内容）：

<div id="push"></div>
<div id="absolution"></div>

小提琴：http://jsfiddle.net/psycketom/DbV4R/

我试图让#absolute身体的第一个孩子，最后一个孩子（假设DOM尚未计算身体开始时的身高）。此外，尝试删除它的height属性以换取top: 0; bottom: 0; - 没有运气。

好吧，我认为这是因为absolute从文档的流程中获取了元素，但是，它是不是有办法解决它？

我的实际例子是我想要一个绝对定位的背景附件元素，它包含许多绝对定位的元素。该元素将overflow: hidden不生成任何滚动条。

除了javascript和定义的高度外，我还有哪些选项？

更新

如果你检查小提琴，你会注意到#absolution身高需要536px，身体需要600。

我希望，#absolution也需要600px - body的全高。

Answer 1

使身体位置相对？删除正文的原始边距/填充以消除所有红色（http://jsfiddle.net/DbV4R/6/）

http://jsfiddle.net/DbV4R/5

body {
    position: relative;
}

身高100％，绝对孩子也要100％

更新

1 个答案: