JSFiddle - React, Tailwind, and code Playground

HTML

<div class="div1">
  <div class="div2"></div>
</div>
<div class="div3"></div>

CSS

.div1{
  position: absolute;
  width: 500px;
  height: 150px;
  background: blue;
  z-index: 12;
}
.div2{
  position: absolute;
  width: 100px;
  height: 250px;
  background: red;
  z-index: 20;/* Как тут сделать чтобы красный блок перекрывал зеленый?*/
}
.div3{
  position: absolute;
  width: 500px;
  height: 150px;
  background: green;
  top: 150px;
  z-index: 13;
}