JSFiddle - React, Tailwind, and code Playground

HTML

<div class="video-container"><div></div></div>
<div class="video-container addConstant"><div></div></div>

CSS

.video-container {
    height: 0px;
    padding-bottom: 28%; /* proportional scaling */
    position:relative;
    width: 50%;
    float: left; /* just to see side by side */
}

.addConstant {
    padding-top: 50px;
}

.video-container div {
    top: 0;
    height: 100%;
    position: absolute;
    width: 100%;
    background-color: cyan;
}

.addConstant div {
    background-color: yellow;
}