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
还有其他选项。如果内容增加了内容$ c> 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;
}