[英]Dynamic height of div with css
我的HTML :
<!-- Content -->
<div class="content">
<!-- Content left -->
<div class="content-left"></div>
<!-- Content center -->
<div class="content-center">
</div>
<!-- Content right -->
<div class="content-right"></div>
</div>
我的CSS :
.content
{
background-color: black;
height: auto;
margin: 80px auto 0px auto;
min-height: 100px;
padding: 10px 10px;
width: 1200px;
}
.content-center
{
-khtml-box-shadow: 0px -3px 5px rgba(0,0,2,2);
-moz-box-shadow: 0px -3px 5px rgba(0,0,2,2);
-webkit-box-shadow: 0px -3px 5px rgba(0,0,2,2);
background-color: #ffffff;
border-left: 1px solid;
border-right: 1px solid;
border-color: #999999;
box-shadow: 0px -3px 5px rgba(0,0,2,2);
height : 900px;
float: left;
width : 800px;
}
.content-left
{
background-color: #fff;
float: left;
height: 300px;
width: 190px;
}
.content-right
{
background-color: #fff;
float: left;
height: 300px;
width: 190px;
}
我的問題是DIV與類“內容”沒有相同的高度與其他元素作為此標記的子項。 根據“內容中心”,“內容左”或“內容權限”,我希望div與類“內容”具有動態高度。 我在類“內容”中使用了min-height和height:auto,但它仍然不正確。
添加overflow:auto
to .content
.content{
width: 1200px;
min-height: 100px;
height: auto;
margin: 80px auto 0px auto;
background-color: black;
padding: 10px 10px;
overflow:auto
}
嘗試這個:
* {
margin: 0;
padding: 0;
}
html, body {
height:100%;
}
.content {
width: 1200px;
min-height: 100px;
height: auto;
margin: 80px auto 0px auto;
background-color: black;
padding: 10px 10px;
display:table;
overflow:hidden;
height:100%;
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.