Z-index不在绝对元素中工作

Question

我已经尝试了一段时间但是.innerThing中的z-index不起作用 我正在尝试将greenBox放在所有好东西上 我在任何地方找不到任何解决方案。

谢谢!!

＆＃13;

＆＃13;

.container {
  overflow: scroll;
  width: 100px;
  height: 100px;
}

.thing {
  position: relative;
}

.innerThing {
  position: absolute;
  background-color: green;
  width: 200px;
  height: 200px;
  z-index: 100000;
}

＆＃13;

<div class="container">
  <div class="thing">
    <div class="innerThing">
      Fun In pita
    </div>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

这就是你想要的。

.container {
  overflow: scroll;
  width: 100px;
  height: 100px;
}

.thing {
  position:relative;
  height:800px;
  background-color:red;
}

.innerThing {
  position: fixed;
  background-color: green;
  width: 81px;
  height: 20px;
}

<div class="container">
  <div class="thing">
    <div class="innerThing">
      Fun In pita
    </div>
  </div>
</div>