JSFiddle - React, Tailwind, and code Playground

by Diana Lemen

HTML

<div class="test1">
<div class="test2">
<div class="test3">
</div>

<div class="test4">
</div>
</div>
</div>

CSS

.test1 {
  display: inline-block;
  width: 100%;
  height: 500px;
}

.test2 {
  display: flex;
  width: 100%;
  height: 100%;
}

.test3 {
  display: flex;
  width: 70%;
  background-color: red;
  height: 100%;
}

.test4 {
  display: flex;
  width: 30%;
  background-color: green;
  height: 100%;
}