JSFiddle - React, Tailwind, and code Playground

HTML

<div class="Wrapper">

  <div class="outerBox">
    <div class="relativeBox">

    </div>
  </div>
  <div class="outerBox">
    <div class="relativeBox">

    </div>
  </div>

</div>

CSS

.Wrapper{
  background: blue;
  position: relative;
}

.outerBox{
  background: green;
  height: 300px;
  width: 300px;
  border: 1px solid white;
  /* position: relative; */
}

.relativeBox{
   background: yellow;
   height: 30px;
   width: 30px;
   position: absolute;
   top: 120px;
   left: 100px;
}