JSFiddle - React, Tailwind, and code Playground

HTML

<div id="titulo"></div>
    <div id="datos">
         <div id="contenedor1"></div>
         <div id="contenedor2"></div>
    </div>

CSS

body, html{
    width: 100%;
    height: 100%;
    margin: 0;
    padding:0;
}
#titulo{
   width:100%;
   height:10%;
   background: red; 
}
#datos{
    width:100%;
    height:90%;
    background: blue;
}
#contenedor1{
    width:100%;
    height:40%;
    background: green;
}
#contenedor2{
    width:100%;
    height:60%;
    background: purple;
}