JSFiddle - React, Tailwind, and code Playground
HTML
<div id="vidcontainer">
<object width="560" height="315"><param name="movie" value="http://www.youtube.com/v/Ni3ZRedt-dg?version=3&hl=en_GB&rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/Ni3ZRedt-dg?version=3&hl=en_GB&rel=0" type="application/x-shockwave-flash" width="560" height="315" allowscriptaccess="always" allowfullscreen="true"></embed></object>
</div>
CSS
#vidcontainer{width:100%; height:100%;}
JavaScript
$(document).ready(function(){
function videoresize(){
$("object, embed, .format-video iframe").each(function() {
var orig = $(this);
var ratio = orig.attr("height") / orig.attr("width");
var parWidth = orig.parents().find("div:last").width();
if(orig.attr("width")!=parWidth) {
orig
.attr("width", parWidth)
.attr("height", (parWidth * ratio));
}
});
}
videoresize();
window.addEventListener('resize', videoresize, false);
});