一个div容器内包含横排的多个div，如何让他们整体居中？除了padding和margin
代码如下
------------------------------------------
<style   type= "text/css ">
.main{width:   400px;   height:   200px;   background:   #999;}
.dv{width:   100px;   height:   100px;   background:   #999;   float:   left;}
</style>
<div   class= "main ">
<div   class= "dv "> dv1 </div>
<div   class= "dv "> dv2 </div>
<div   class= "dv "> dv3 </div>
</div>

------解决方案--------------------
<style type= "text/css ">
.main{width: 400px; height: 200px; background: #999; text-align:center;}
.dv{width: 100px; height: 100px; background: #999; float: left; text-align:left;}
.center {
width:300px;
margin:auto;
}
</style>
<div class= "main ">
<div class= "center ">
<div class= "dv "> dv1 </div>
<div class= "dv "> dv2 </div>
<div class= "dv "> dv3 </div>
</div>
</div>