html - 使 DIV 随内容展开而不是滚动

Question

嘿，我正在开发一个网站，我在添加 overflow:auto; 的早期遇到了一个问题；到我所有的主要类(class) .header .content .footer 因为我有一些背景和功能区错误，它会立即清除。

但是我最近发现，由于这个属性，如果我禁用 overflow:auto;，当 .content 类有足够的内容时，它会滚动而不是继续扩展(我已经尝试过 height:auto; 和 height:100%;)内容继续在我的 .footer 之上，我的丝带和背景也乱七八糟。

我不确定是否可以强制扩展 div 或是否必须重新设计所有 CSS？

这不是一个大问题，网页在滚动时仍能正常工作，但肯定有解决办法。

.Header
{
width:  100%;
overflow: auto;
padding-top: 80px;
background: rgb(45, 55, 60);
}

.Content
{
width:  100%;
overflow: auto;
padding-top: 50px;
background: rgb(255, 250, 240);
}

 .Footer
{
width:  100%;
overflow: auto;
padding-top: 30px;
background: rgb(250, 250, 250);
}

我想也可能是当时的内容，但我真的很茫然，过去 4 个小时一直在搜索，认为发布可能是明智的。

Answer 1

从所有类中删除 overflow: auto;。它们应该自行扩展内部的内容。

http://jsfiddle.net/BGLMJ/4/