CSS min-height 100%页面,内容高度100%

时间:2012-11-03 23:55:29

标签: css

我创建了一个页脚,其最小高度为100%,页脚为http://peterned.home.xs4all.nl/examples/csslayout1.html

它适用于页面填充div,但我希望其中的元素也占用它们可用的所有高度。

尝试:

  • 向其添加height: 100%不起作用。他们将使用父亲的身高,但还有其他元素和填充等,所以这是错误的高度。
  • 将它们设为绝对并设置top: 0px; bottom: 0px;。这将使div填满整个高度,但如果添加内容则div不会变高。

如果这个解释不清楚,我在这里有一个例子:http://markv.nl/stack/quine.php

所以父母决定最低身高,内容也是如此。应选择最高的。我发现这是一个艰巨的挑战;没有javascript可以吗?

提前致谢!

2 个答案:

答案 0 :(得分:0)

没有javascript就可以。但是你不应该对这个问题使用绝对定位。使用this解决方案将页脚粘贴到页面底部。并使内容div min-height:100%。随着更多的内容,它会扩展并向下推动页脚,页面底部的内容页脚将很少,内容div将被推送到页脚。

答案 1 :(得分:0)

经过大量的摆弄,我完全相信我想做的事是不可能的。如果我错了,请纠正我。

就我而言,事实证明可以修复。我使用position: absolute来创建背景图案。在此之上,我在width:100% div中添加了内容以使页面缩放。

它只适用于某些应用程序,但我认为通用解决方案是不可能的。