JSFiddle - React, Tailwind, and code Playground

HTML

<div id="overlapper"></div>
    <div id="container">
        <div id="child1"></div>
        <div id="child2"></div>
    </div>

CSS

#overlapper, #child1, #child2
    {
        height: 100px;
        width: 100px;
        position: absolute;
    }
    #overlapper
    {
        background: red;
        top : 40px;
        left : 40px;
        z-index: 1;
    }
    #child1
    {
        background: yellow;
        z-index: 0;
    }
    #child2
    {
        top: 60px;
        left : 60px;
        background: black; 
        z-index: 2;
    }