JSFiddle - React, Tailwind, and code Playground

HTML

<div class="parent">
  <div class="child"></div>
</div>

CSS

.parent {
  width: 30%;
  border: 1px dotted red;
}

.child {
  padding-top: 100%;
  border: 1px solid black;
}