0

我有：

<div style="position: relative; width: 500px; background-color:Yellow;">
    <div style="position: absolute; top: 0px; left: 0px;">A</div>
    <div style="position: absolute; top: 0px; right: 0px;">B</div>
</div>

并且background-color被忽略。但是当我删除style第一个内部 div 时 - 显示颜色。为什么？

4

4 回答 4

3

为您的第一个 div 设置一个高度

像：

<div style="height:30px;position: relative; width: 500px; background-color:Yellow;">
    <div style="position: absolute; top: 0px; left: 0px;">A</div>
    <div style="position: absolute; top: 0px; right: 0px;">B</div>
</div>

http://jsfiddle.net/pcAjF/

于 2013-06-05T21:55:35.343 回答
3

当一个元素被绝对定位时，它将被从文档流中取出，这意味着包含元素的行为就好像它不存在一样。因为两个内部 div 都是绝对定位的，所以外部 div 没有高度。

于 2013-06-05T22:02:35.883 回答
2

absolute定位元素不是父维度的一部分。这意味着，如果您有一个具有auto高度的元素并且它内部只有一个绝对定位的 div，它将导致高度为 0，因此background-color如果您指定了任何高度，它将不会有任何高度。

如果你想让你的颜色出现，请指定一个高度或者不要让你的内部 div 绝对。

于 2013-06-05T21:58:47.683 回答
1

你有absolute position两个 inner<div>的 soheight并且width是零。

于 2013-06-05T21:55:47.937 回答