JSFiddle - React, Tailwind, and code Playground

HTML

<div id="resizable">
	<div id="bad"></div>
	resize me
</div>

CSS

#resizable {
	resize: both;
	overflow: auto;
	width: 100px;
	height: 140px;
	padding: 20px;
	border: 1px solid black;
}

#bad {
	width: 100%;
	padding-bottom: 56.25%; /* 16:9 */
	background: linear-gradient(to right, gray, black, gray);
}