JSFiddle - React, Tailwind, and code Playground

HTML

<table border="1" width="100%" style="height: 100%;">
    <tr>
        <td width="20%" height="5%"></td>
        <td width="60%" height="5%"></td>
        <td width="20%" height="5%"></td>
    </tr>
    <tr>
        <td width="20%" height="15%"></td>
        <td id="upper_logo" width="60%" height="15%">
        </td>
        <td width="20%" height="15%"></td>
    </tr>
    <tr>
        <td width="20%" height="20%"></td>
        <td width="60%" height="20%">

        </td>
        <td width="20%" height="20%"></td>
    </tr>
    <tr>
        <td width="20%" height="55%"></td>
        <td width="60%" height="55%">
        </td>
        <td width="20%" height="55%"></td>
    </tr>
    <tr>
        <td width="20%" height="5%"></td>
        <td width="60%" height="5%"></td>
        <td width="20%" height="5%"></td>
    </tr>

</table>

CSS

html, body {
	margin:0px auto; padding:0;
	height:100%;
}
body{
    height: 100%;
}
#upper_logo{
    position: relative;
}

#fff{
    position: absolute;
    right: 0;
    top: 0;
}

JavaScript

function draw() {
    $('#upper_logo').empty();
    var height = $('#upper_logo').height();
    var width = $('#upper_logo').width();
    var src = "http://i.imgur.com/5t1VyaQ.png";
    var src_fb = "http://i.imgur.com/cVUcmwx.png";
    
    var ob = document.createElement("img");
    ob.setAttribute("src", src);
    ob.setAttribute("id", "ob");
    ob.setAttribute("height", height);
    ob.setAttribute("width", width);
    document.getElementById("upper_logo").appendChild(ob);
    
    var ob_fb = document.createElement("img");
    ob_fb.setAttribute("src", src_fb);
    ob_fb.setAttribute("id", "fff");
    ob_fb.setAttribute("height", height);
    ob_fb.setAttribute("width", height * 0.376);
    document.getElementById("upper_logo").appendChild(ob_fb);
}

draw()
$(window).resize(function () {
    draw();
});