html - 固定位置不会让我滚动，相对位置不会拉伸 div

Question

感谢您的帮助。我有一个带有容器 div 的站点，我想将其拉伸到页面底部。使用position: fixed我能够实现这一点，但底部的页脚文本被截断，您无法向下滚动。

使用position: relative我可以滚动，但容器 div 不会延伸到页面底部。

我的代码如下：

.container {
  position: relative;
  bottom: 0;
  top: 0;
  left: 50%;
  margin-left: -480px;
  width: 960px;
  height: auto;
  background-color: #1b1a1a;
}

.body {
  width: 703px;
  min-height: 340px;
  margin: auto;
  background-color: #f2f2f2;
  padding: 20px;
  overflow: hidden;
}

<div class="container">
  <div class="header"></div>
  <div class="body">
    content content content
  </div>
  <div class="footer"></div>
</div>

Answer 1

这是你想要的？

http://jsfiddle.net/gespinha/jrsxN/7/

CSS

html, body {
    height:100%;
    margin:0;
    padding:0;
}
.container {
    width:100%;
    height:100%;
    position: absolute;
    background-color: #1b1a1a;
}
.body {
    background-color: #f2f2f2;
    padding: 20px 20px 120px;
}
.footer {
    width:100%;
    height:100px;
    position:fixed;
    bottom:0;
    background:#f00;
}