JSFiddle - React, Tailwind, and code Playground

HTML

<div style="position:relative; width: 500px; height: 500px; border: 1px solid red;">
    <div style="position:absolute;right:0px;bottom:0px;width: 200px; height: 100px; border: 1px solid green;">
    </div>
</div>

CSS

#wrapper
{
    width: 2px;
    height: 2px;
    border: solid 2px red;
    position:absolute;
}

JavaScript

var vidRatio = $("#vid").height()/$("#vid").width();

setInterval(function(){
        $("#vid").height($(window).height() - $("header").height() - 7);
        var width = $(window).width()-20;
        $("#wrapper").css({
            'width': width, 
            'height':width*vidRatio,
            'top':($(window).height()-width*vidRatio)/2
        });
    /*There is a header and a bunch of other stuff in the original code*/
}, 10);