Question

我有一些div。我需要两个孩子。第一个应该处于静态位置并且处于第二个位置。

alt text http://a.imageshack.us/img685/8185/imgpk.png

橙色矩形应定位到父div并具有静态位置（例如，top：20px;）。第二个孩子（红色矩形）应该在所有另一个div上。

我试图使橙色div绝对并使用z-index来操纵draw-queue。但它始终位于顶部（或者在z-index为负数时低于所有另一个）

你能帮我解决这个问题吗？

UPD

<div id="content">
      <div id="secondChild"></div>
</div>
<div id="firstChild"></div>

#content
{
    position: absolute;
    width: 100%;
}
#secondChild
{
    z-index: 9999;
}
#firstChild
{
    position: absolute;
    z-index: -1;
}

Answer 1

你能试试吗？

<html>
<head>
<style type="text/css"> 
#content
{
   position: absolute;
   height: 300px;
   width: 200px;
   margin-left: 30px;
   background-color: blue;
}
#secondChild
{
   z-index: 9999;
   width: 100%;
}
#firstChild
{
   position: absolute;
   width: 50px;
   height: 50px;
   z-index: -1;
   margin-top: 120px;
   background-color: red;
}
</style>
</head>

<body>
  <div id="content">
     <div id="secondChild">Second Child</div>
  </div>
  <div id="firstChild">First Child</div>
</body>
</html>

Answer 2

Z-index适用于渲染上下文，因此在您的情况下，它需要应用于#content，而不是第二个子。此外，如果红色div位于页面流中的橙色div之后，它应该已经与您需要的方式重叠。

太糟糕了，你没有给出完整的（呃）来源，有边距等，所以我可以尝试重现这个。

div的css问题

2 个答案: