Home >Web Front-end >HTML Tutorial >Use CSS to achieve equal height of divs_html/css_WEB-ITnose
方法1:兼容IE6.7.8.9.10.FF.Chrome
.wrap {
width: 500px;
margin: auto;
overflow: hidden;
}
.left, .right {
padding-bottom: 32767px;
margin-bottom: -32767px;
color: white;
}
.left {
background-color: #000;
width: 200px;
float: left;
height: 800px;
}
.right {
background-color: red;
width: 300px;
float: right;
}
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
方法2:
这个方法的优点:
代码少,简单
缺点:不兼容IE7.6
* {
margin:0;
padding:0;
border:0;
list-style:none;
}
.cell1, .cell2, .cell3 {
display:table-cell;
width:180px;
padding-left:10px;
background-color:#ff6a00;
border:1px solid #00ffff;
}
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa
aaa