css - 将一个 div 定位在其他 div 之下

Question

我目前正在学习如何对主题进行切片，我希望获得有关将一个 div 置于其他 div 之下的帮助。例如，我想将 div (box1-box3) 放置在 AdSales&Announcements div 下并使它们居中。如果你注意到 fiddle 上的 div 没有居中广告其他 div。提前致谢。

<div id="AdSales">

</div>
<div id="Announcements">

</div>

<div id="Box1"></div>

<div id="Box2"></div>

<div id="Box3"></div>

http://jsfiddle.net/edwinakatosh/YjLCe/embedded/result/

Answer 1

将三个 div 包装在一个包装器 div 中。你需要删除你的 div 的 top: 样式，这样包装器才能完成它的工作

HTML

</div>
<div id="Announcements"></div>


<div class="wrapper">
 <div id="Box1" class="box"></div>
 <div id="Box2" class="box"></div>
 <div id="Box3" class="box"></div>
</div>

CSS

#adSales, #Announcements{top:0}
.box{top:0; }
.wrapper{width:780px; margin:0 auto; overflow:hidden}

margin: 0 auto 居中对齐没有 float 的 div。 overflow: hidden 重新计算 float 子 div。 width: 780px 是包装子 div 的总宽度加上边距