清除浮动的几种方式

<div class="container">
    <div class="fl"></div>
    <div class="fr"></div>
</div>

<style>
    .fl{float:left;}
    .fr{float:right;}
</style>

<div style="clear: both;height: 0; line-height: 0; font-size: 0"></div>

.container{
    overflow: auto;
    zoom: 1;
}

.container:after{
    content:'';
    display: block;
    clear: both;
    height:0;
    width:100%;
    visibility: hidden;
}
.container{
　　zoom:1;//为了兼容IE
}

.container:before,.container:after {
    content: "";
    display: block;
    clear: both;
}
.container{
    zoom: 1;
}

.container{
    width:100%;
    display:table;
}

.container{
    width:100%;
    display:inline-block;
} 

.container{
    overflow:hidden;
}

.container{
    height:50px;
}