JSFiddle - React, Tailwind, and code Playground

by alexb

HTML

<!-- Container has an aspect ratio of 40:39 -->
<div id="container">
  <!-- Content has an aspect ratio of 1:1 -->
  <img
    id="content"
    src="https://dummyimage.com/200/000300/ffffff"
    alt=""
  />
</div>

CSS

#container {
  background: red;
  width: 200px;
  height: 195px;
  overflow: auto;
}

#content {
  /* Content width is reduced to match container width */
  max-width: 100%;
  vertical-align: top;
}

JavaScript

setInterval(() => {
	container.appendChild(content);
}, 500);