[英]div filling up all remaining white space (not 3 columns)
I have 3 divs stacked on top of one another: 我有3个div彼此叠放:
How can I have div2 take up remaining screen height? div2如何占用剩余的屏幕高度?
note: i don't want to use javascript. 注意:我不想使用javascript。
<div id="top"></div>
<div id="middle"></div>
<div id="bottom"></div>
#top,#bottom {
position:absolute;
height:20px;
left:0;
right:0;
}
#top { top:0; }
#bottom { bottom:0; }
#middle {
position:absolute;
top:20px;
bottom:20px;
left:0;
right:0;
}
It should work. 它应该工作。
Maybe something like this: 也许是这样的:
<div id="top">
top div
</div>
<div id="middle">
middle div
</div>
<div id="bottom">
bottom div
</div>
#top {
height: 20px;
}
#bottom {
height: 20px;
bottom: 0;
position: absolute;
width: 100%;
}
See this code in action: http://jsfiddle.net/PzA3W/ 实际操作中请参见以下代码: http : //jsfiddle.net/PzA3W/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.