61,112
社区成员
发帖
与我相关
我的任务
分享div内部嵌套的多个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>
多谢~
...全文
请发表友善的回复…
发表回复
wurenkebi 2012-11-27
- 打赏
- 举报
[code=css]
lingrain 2011-11-18
- 打赏
- 举报
我按楼上的做出来了，多加了一个标签。
.left
{
float:left;
width:33%;
margin:20px auto;
}
<div id="1" style=" margin:0 auto; width:500px;height:60px;background:#900; text-align:center;">
<div class="left" ><div id="2" style=" width:50px; height:20px; background-color:Red; ">中间1</div> </div>
<div class="left" ><div id="3" style=" width:50px; height:20px; background-color:Yellow; ">中间2</div> </div>
<div class="left" ><div id="4" style=" width:50px; height:20px; background-color:Gray;">中间3</div></div>
p2227 2011-11-18
- 打赏
- 举报
<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>lingrain 2011-11-18
- 打赏
- 举报
测试了，水平，居中，均布，都没效果啊。
[Quote=引用 1 楼 kspaul 的回复:]
可以设置层的位置，
如：
C# code
<div style="left: 30px; width: 281px; position: absolute; top: 150px; height: 111px;
background-color: aqua">
</div>
[/Quote]
[Quote=引用 1 楼 kspaul 的回复:]
可以设置层的位置，
如：
C# code
<div style="left: 30px; width: 281px; position: absolute; top: 150px; height: 111px;
background-color: aqua">
</div>
[/Quote]
kspaul 2011-11-18
- 打赏
- 举报
可以设置层的位置，
如：
如：
<div style="left: 30px; width: 281px; position: absolute; top: 150px; height: 111px;
background-color: aqua">
</div>
