JSFiddle - React, Tailwind, and code Playground

by Christian Gambardella

HTML

<div class="box"></div>

SCSS

.box{
	position: relative;
	width: 100%;		/* desired width */
    background-color: #afa;
}
.box:before{
	content: "";
	display: block;
	padding-top: 50%; 	/* initial ratio of 1:1*/
}