日期:2014-05-17  浏览次数:21430 次

div内部嵌套的多个div如何做到:水平并列并均匀分布?
如题,
要求内部的三个div水平并均匀分布(即中间要有间隔,不能挤在一起,也不能靠一边),
且垂直居中(即上下边距一样)。

如下:

<div id="1" style=" height:40px; width:500px;"> 
 <div id="2" style=" height:20px;width:50px;">中间1</div> 
 <div id="3" style=" height:20px; width:50px;">中间2</div> 
 <div id="4" style=" height:20px; width:50px;">中间3</div>
</div> 


多谢~
------解决方案--------------------
<html>
<head>
<style>
.left{
float:left;
width:33%;
}
</style>
</head>
<body>
<div id="1" style=" height:40px; width:500px;"> 
 <div class="left" id="2" style=" height:20px;">中间1</div> 
 <div class="left" id="3" style=" height:20px;">中间2</div> 
 <div class="left" id="4" style=" height:20px;">中间3</div>
</div>
</body>
</html>