Html css定位-某个div的正下方

我已经创建了一个div元素的id，并尝试提供以下属性：

.bu
{
background: #eee; padding: 10px; position:absolute; margin: 0 0 15px 0;width:750px; -moz-box-shadow: 0 0 5px #666; -webkit-box-shadow: 0 0 5px #666; 
}

紧接着，我创建了另一个具有相同id的div元素，但是我添加的第二个div出现在第一个元素的中间

下面是对代码段的更好解释：

<div style = "position:absolute; top:50px;">
<div class= "bu">
---something about height 200px
</div>
</div>

<div class="bu">
something
</div>

---大约200px的高度
某物

我的想法是，第二个div应该出现在第一个div结束的地方之后。我可以将属性“position:absolute；top:250px；”提供给第二个div，但每个div的内容将由用户决定，没有特定的高度。我在哪里失踪

谢谢

---

__不精通css，我希望这是你想要的

---

很少有位置属性值是：

静态：这是默认值，它意味着元素将正常流动，即从左到右，从上到下。元素将在不重叠的情况下定位自己

绝对：这意味着元素将根据其父元素的位置具有特定的位置（左侧、顶部等）它们可能与其他元素重叠，这可以使用z索引属性解决

因此，您可能希望创建一个父元素并为其指定绝对位置…并创建两个没有任何位置值的内部div

请参阅此代码。。。。

---

不能有多个元素具有相同的

id

使用

class

！好的，我更改了它，但仍然相同如果您希望div相对对齐，那么使用

位置：相对

而不是

位置：absolute

来定义它们的精确位置。对，但我没有给出位置：绝对；顶部：50px；如果两个元素使用相同的

类

，则它们必须继承相同的CSS属性，除非它们被另一个类或内联CSS规则区分。