Css清除浮動

.cf:after {    content:"";    clear: both;    display:table;}

.content{
　　width:1020px;
　　margin:0 auto;
　　box-shadow:0 10px 30px rgba(0,0,0,0.3);
　　background:#FFFFFF;
　　border-radius:5px;
　　border:1px solid #E53351;
}

 

.sub_colum{
　　float:right;
　　width:30%;

　　height:300px;

}

section[role="main"]{
　　float:left;
　　width:67%;

　　height:300px;
}

<div class="content cf">  <section role="main" class="main"></section>  <aside></aside></div>

 

.cf 樣式可以清除內部的左右浮動，相容IE6-8，FF和chrom；

 

下面這樣只能IE6 7有效

.cf:after {    clear: both;}