JSFiddle - React, Tailwind, and code Playground
HTML
<div id="header">
header
</div>
<div id="left">
<div class="inner-left">
left
</div>
</div>
<div id="right">
<div class="inner-right">
right
</div>
</div>
CSS
body{
padding: 0px;
margin: 0px;
}
#header {
position: relative;
height: 50px;
padding: 10px;
background-color: green;
}
#left {
position: relative;
height: 200px;
width: 30%;
background-color: red;
float: left;
display: block;
}
.inner-left {
padding: 10px 10px;
color: white;
}
.inner-right {
padding: 10px 10px;
color: white;
}
#right {
position: relative;
height: 200px;
width: 70%;
float: right;
background-color: black;
display: block;
}