我以为兼容最好最简便的是padding补偿法。因此把它分享给你们。css
1.把列的padding-bottom设为一个足够大的值。code
2.把列的margin-bottom设一个与前面的padding-bottom的正值相抵消的负值,父容器设置超出隐藏,这样子父容器的高度就仍是它里面的列没有设定padding-bottom时的高度,当它里面的任一列高度增长了,则父容器的高度被撑到它里面最高那列的高度,其余比这列矮的列则会用它们的padding-bottom来补偿这部分高度差。由于背景是能够用在padding占用的空间里的,并且边框也是跟随padding变化的。class
HTML代码:容器
<div class="wan"> <div class="box">大赛盛大上大学操做现场是啥看监控活动卡仍是打动卡仍是打动卡仍是打动卡仍是打动卡仍是打动卡仍是打动卡仍是打动卡仍是打</div> <div class="box1">动卡仍是打动卡仍是打动卡仍是打动卡仍是打动卡仍是打动卡仍是打动卡仍是打</div> </div>
css部分:监控
.box{ width: 200px; background: red; float: left; padding-bottom: 3000px; margin-bottom: -3000px; } .box1{ background: #00FFFF; margin-left: 200px; margin-bottom: -3000px; padding-bottom: 3000px; } .wan{ overflow: hidden; }