没加clear：both为什么一样能出效果是我的代码错误了吗
下面是代码：
<style type="text/css">
body{
font-style:italic;
margin:0;
padding:0;
font-size:15px;
}
div{
text-align:center;
line-height:30px;
}
.top{
height:50px;background:#09C;
}
.head{
width:600px;
height:50px;
background:#C33;
margin:0 auto;
}
.main{
margin:0 auto;
background:#00F;
width:600px;
height:700px;
}
.left{
width:150px;
height:700px;
float:left;
background:#6CF;
}
.right{
width:450px;
height:700px;
float:right;
background:#C36;
}
.sub_left{
width:225px;
height:700px;
background:#99C;
float:left;
}
.sub_right{
width:225px;
height:700px;
background:#3FC;
float:right;
}
.footer{
height:50px;
background:#F00;
}
</style>
下面是div：
<div class="top">
<div class="head">head</div>
</div>
<div class="main">
<div class="left">left</div>
<div class="right">
<div class="r_sub_left">sub_left
</div>
<div class=" r_sub_right">sub_right
</div>
</div>
</div>
<div class="footer">footer</div>
