在其他div后面显示<div>

Question

<div>父母内部有一个(父母,例如100px x 100px)和其他<div>s(儿童,例如四个50px x 50px的正方形).

<div id="parent">
  <div id="ch1">...</div>
  <div id="ch2">...</div>
  ...
</div>

孩子们完全填满了父母.现在,我想在父级中显示和隐藏文本,但我希望它显示在子级后面.如果我这样做:

<div id="parent">TEXT
  <div id="ch1">...</div>
  <div id="ch2">...</div>
  ...
</div>

它打破了孩子的布局.z-index: -1不起作用.知道怎么解决吗？

Answer 1

CSS:

#parent{
    position:relative;
}

#ch1{
    position:absolute;
    top:0;
    left:0;
}

#ch2{
    position:absolute;
    top:0;
    left:50px;
}

#ch3{
    position:absolute;
    top:50px;
    left:0;
}

#ch4{
    position:absolute;
    top:50px;
    left:50px;
}