为什么我的 <div> 没有扩展到 height:100%？答案

【问题标题】：Why does my <div> not expand to height:100%?为什么我的 <div> 没有扩展到 height:100%？
【发布时间】：2009-10-07 16:04:27
【问题描述】：

我有 3 个与此相对应的 div。

我有#wrapper，它包裹着一切。那是#EEE 我有#contain，它在#wrapper 之后。那是#FFF（与内容部分）
我有#secondaryContent，它的高度：100% 非常好，位置：固定。这在这两个 div 中。

我为所有主要的 div 添加了边框以查看发生了什么。

好的，中间 div 的底部应该 100% 延伸到底部，显示包装没有灰色。如果您仔细查看页面顶部，您会看到一条紫色线。这实际上是一个名为#content 的div，它应该包含所有的帖子。我不知道它显示什么，好像里面什么都没有，但它应该 //(* 固定 * - 见第二个答案)。

您可以通过我的服务器了解我的意思。

Server

修复***
应用于#wrapper div 的类 '.container' 搞砸了一切。

【问题讨论】：

标签： css height html

【解决方案1】：

我认为这是因为 #Content div 中有浮点数。

您可以将此类“hasFloats”添加到您的 css 文件和 #content div 中。

更新

.hasFloats { _height: 1%; }

.hasFloats:after { content: "."; visibility: hidden; display: block; clear: both; height: 0; font-size: 0; }

<div id="content" class="hasFloats">

希望这会有所帮助。

【讨论】：

虽然，这确实解决了我的#content div 不扩展问题，但它并没有解决我的主要问题：[ 确实有帮助！我希望我能投票给你，但显然我不能。顺便提一句。它实际上是 'height:1%' 吗？ '' 有什么作用？
很高兴它有帮助。你的主要问题是什么？
我的主要问题是：grabup.com/uploads/ccef44fbf9e2bbea894c925c944f43a2.png 白色部分没有一直扩展到窗口的“100%”。就像侧边栏一样。

【解决方案2】：

您需要将body 设置为height: 100%，否则它不会占据全屏。

编辑：对不起，我在查看该网站之前回答了。如果它没有占据全部高度，您是否检查了多余的margin 或padding？

【讨论】：

我没有发现任何多余的边距和内边距。那是我寻找的第一件事。虽然，我是人类，但我可能错过了一些东西。我认为这还不够。
其实我觉得你得让 html {height: 100%; }。至少对于 IE7
您不必指定高度！它会随着内容自动展开。
好吧，显然我是为我的#secondaryContent 侧边栏做的。
另外，html height:100% 并不能解决这个问题。已经试过了。
grabup.com/uploads/…>
好吧，显然我是为我的#secondaryContent 侧边栏做的。此外， html height:100% 不能解决这个问题。已经试过了。 grabup.com/uploads/690262737061f634b9c22713cf77dabe.png

【解决方案3】：

有一个名为 'container' 的类应用于 div 'wrapper'。此类容器来自我使用的 Habari CMS 提供的不同样式表。通过从 div 中删除此类，高度现在扩展到文档窗口。

【讨论】：