div与最小高度和子div具有父级的高度 [英] div with min-height and the child div have the height of parent
本文介绍了div与最小高度和子div具有父级的高度的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
Div与最小高度和子div具有父级的高度。
Div with min-height and the child div have the height of parent.
是否可能只需要CSS或javascript?
Is it possible with only CSS or javascript is needed?
示例:
#main {
min-height: 300px;
width: 100%;
}
#menu, #content {
float: left;
width: 50%;
}
#menu {
height: 150px;
background-color: red;
}
#content {
height: 100%;
background-color: green;
}
<div id="main">
<div id="menu">menu</div>
<div id="content">content</div>
<div>
推荐答案
#main {
min-height: 300px;
width: 100%;
position:relative;
background-color: yellow;
}
#menu, #content {
float: left;
width: 50%;
overflow:hidden;
}
#menu {
height: 150px;
background-color: red;
}
#content {
height: 100%;
background-color: green;
position:absolute;
top:0;
right:0;
}
检查此 http://jsfiddle.net/sandeep/hKttB/
EDIT
还有其他选项。如果内容增加了内容 div > main
div也增加。
EDIT
there are other option also . You can give min-height
to your content
div also if the content increase the height of the main
div also increase.
#content {
height: 100%;
min-height:300px;
background-color: green;
}
检查此小提琴 http://jsfiddle.net/sandeep/SRJrF/2/
这篇关于div与最小高度和子div具有父级的高度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文