垂直拉伸div

Question

我有3个div元素

< div id="header">FIXED CONTENT< /div >
< div id="content">DYNAMIC CONTENT< /div >
< div id="footer">FIXED CONTENT< /div >

如何做到这一点，标题保持在顶部，页脚位于底部＆amp;内容div垂直拉伸＆amp;填补标题和＆amp;之间的空白页脚。 我希望这个问题很清楚。

Answer 1

使用纯CSS：

#header {
  height: 100px;
}

#content {
  height: 100%;
  margin: 100px 0;
}

#footer {
  position: absolute;
  bottom: 0;
  height: 100px;
}