JSFiddle - React, Tailwind, and code Playground

HTML

<div class="ratio">
    <object>
        <param name="movie" value="http://www.youtube.com/v/_M0khLwUedI?version=3&amp;hl=en_US"></param>
        <param name="allowFullScreen" value="true"></param>
        <param name="allowscriptaccess" value="always"></param>
        <embed src="http://www.youtube.com/v/_M0khLwUedI?version=3&amp;hl=en_US" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true"></embed>
    </object>
    
</div>

CSS

.ratio{
    display: inline-block;
    position: relative;
    width: 100%;    
}
.ratio::after {
    content: '';
    display: block;
    margin-top: 56.25%;
}
.ratio object, 
.ratio embed {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
}