css 浮动的div进行居中
最近学习了一下HTML5的东西,在做练习的时候发现了,一个好玩的东西,在div浮动的时候,常用的margin: 0 auto;不能起作用。
解决方法:在浮动的div再加一个div
<!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> #container{ width:400px; height:110px; border:1px solid black; } .content{ width:300px; margin: 0 auto; } .content div{ width:100px; height:100px; float:left; } .left{ background-color:red; } .middle{ background-color:green; } .right{ background-color:blue; } </style> </head> <body> <div id="container"> <div class="content"> <div class="left">left</div> <div class="middle">middle</div> <div class="right">right</div> </div> </div> </body> </html>