JSFiddle - React, Tailwind, and code Playground

by danya_postfactum

HTML

<div id="leftside">
   <div id="topblock">
       <!-- <img src="xxx.jpg" id="firstimage"> --><div style="background:blue"></div>
   </div>
     
   <div id="bottomblock">
       <!-- <img src="yyy.jpg" id="secondimage"> --><div style="background:red"></div>
   </div>
</div>
<div id="rightside" style="height: 2000px;"></div>

CSS

#leftside, #rightside{
    float: left;
    width: 50%;
}
html, body{
    height: 100%;
    margin: 0;
    padding: 0;
}
#leftside{
    height: 90%;
}
#topblock, #bottomblock{
    height: 50%;
}
#topblock div, #bottomblock div{
    height: 100%;
}