JSFiddle - React, Tailwind, and code Playground

by Dmitriy Shvanyk

HTML

<div><h3>4:3</h3></div>

CSS

div{
  background: #ccc;
  padding-bottom: 75%; /* 3/4*100=75% */
  position: relative;
}
div > h3{
  font-size: 50px;
  font-weight: 700;
  position: absolute; top: 50%; left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}