JSFiddle - React, Tailwind, and code Playground

HTML

<div class="parent">
  <div id="element"></div>
</div>

CSS

.parent {
  background: yellow;
}

#element {
  position: relative;
  /* optional */
  width: 100px;
  height: 100px;
  background-color: blue;
  border: 4px solid black;

}

#element::after {
  content: "";
  width: 150px;
  height: 150px;
  background-color: red;
  left: 0;

  /* create a new stacking context */
  position: absolute;
  z-index: -1;
  border: 4px solid black;
  /* to be below the parent element */
}