JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <div>
    <div>
    </div>
    <div>
    </div>
  </div>
</div>

CSS

html,body{
  height:100%;
}

body>div{
    height: 100%;
    padding-right: 30%;
    background-color: blue;
    position: relative;
}

body>div>div{
  width:30%;
  background-color:red;
  height:100%;
  position: absolute;
  right: 0px;
}

body>div>div div:nth-child(1){
  height:75%;
  background-color:green;
}

body>div>div div:nth-child(2){
  height:25%;
  background-color:white;
}