div中嵌套的多个div使用了浮动后居中的办法

今天做网页的时候遇到了标题中的问题,网上查到了解决办法,记录一下一放以后忘记

 

 

1 <div class="wai">
2         <div style="float:left"></div>
3          <div style="float:left"></div>
4          <div style="float:left"></div>
5 </div>

上面的外边的div使用text-align:center 不起作用了,这个时候里面再嵌套一个div,加如下样式

1 <div class="wai">
2     <div class="li">
3         <div style="float:left"></div>
4         <div style="float:left"></div>
5         <div style="float:left"></div>
6      </div>
7 </div>

css样式表如下

1 .li{overflow:hidden; display:inline-block}
2 .wai{text-align:center}

完美解决!