JSFiddle - React, Tailwind, and code Playground

by BandonRandon

HTML

<div id="top-left"></div>
<div id="top-right"></div>
<div id="bottom-right"></div>

CSS

#top-left {
position: absolute;
top: 0px;
left: 0px;
width: 50%;
height: 100%;
background: #000 url('http://placekitten.com/2000/1000') no-repeat;
-moz-background-size: cover;
background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
background-color: transparent;
}

#top-right {
position: absolute;
top: 0px;
left: 50%;
width: 50%;
height: 50%;
background-color: green;
}


#bottom-right {
position: absolute;
top: 50%;
left: 50%;
width: 50%;
height: 50%;
background-color: yellow;
}