两个垂直div在100%高度div [英] Two vertical divs within a 100% height div
问题描述
对不起,因为我的英语不好,希望你能理解我的问题。
Sorry for my bad english, hope you will understand my issue.
我把我的头转向一个问题,我知道我一直在解决一次。问题是,我需要在一个div内的两个DIV,其中一个DIV具有给定的高度,另一个填充父div的高度的其余部分。问题是,第二个div(没有定义的高度,或100%的高度)需要用垂直滚动条溢出。所有这一切都是做一个展望外观相似的windowsetup,你在左边操作一个列表和右边的动作窗口。左侧列表需要一个标题,您可以限制列表以及搜索。
I'm turning my head around a problem that I know I've been solving once before. The issue is that I need two DIVs inside a div where one of the DIVs has a given height and the other one fills up the rest of the parent div height. The problem is that the second div (with no defined height, or 100% height) needs to be overflow-able with an vertical Scroller. All this is to make an "outlook" lookalike windowsetup where you operate a list on the left and an actionwindow on the right. The left list needs a header where you can limit the list as well as search.
查看 http://kokongcrm0.server111.wdc.webdeal.no/index-test.php 查找问题的示例。
所有帮助都很好帮助(!)Thanx提前。如果有人可以帮助,我会很高兴。
All help is good help (!) Thanx in advance. I would be so glad if someone could help!
推荐答案
使用 position:relative
结合 position:absolute
。
Use position: relative
combined with position: absolute
.
Live Demo
删除最后两行:
div#iHeader { height:50px; background:#009900; }
div#iWrapper { height:100%; padding-top:-50px; padding-bottom:-150px; overflow:auto; }
将其替换为:
div#list {
position: relative
}
div#iHeader {
height:50px; background:#009900;
width: 100%;
position: absolute;
top: 0;
left: 0
}
div#iWrapper {
overflow:auto;
width: 100%;
position: absolute;
top: 50px;
left: 0;
bottom: 0
}
这篇关于两个垂直div在100%高度div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!