带顶部和底部边距的拉伸div - css/css3

Question

我有一个divs如下的页面;

<div id="container"> 
    <div id="header"></div> 
    <div id="content"> 
     <div id="wrap2"></div> 
     <div id="wrap"></div> 
    </div> 
    <div id="footer"></div> 
</div> 

我有wrap2特定的高度，我想wrap填写下列wrap2区域，但高于footer。你可以看到小提琴here。我想在wrap2和footer之间拉伸wrap。我正在寻找一个纯粹的CSS解决方案。

我该怎么做？

Answer 1

我解决了它的设置padding-bottom: 31px;#content和100% height为wrap。

你可以看到结果小提琴here

感谢@DA，@Jaspero和@Ima学生

Answer 2

你不能用纯CSS。这也许是关于CSS的最大抱怨。最准确的选择是使用JavaScript。在onload和onresize上调用一个JS函数，该函数抓取视口的高度，减去页脚和页眉的高度，然后设置div的高度以填充其余部分。