JSFiddle - React, Tailwind, and code Playground

HTML

<div class="left">Left content hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now hey now </div>
<div class="middle">mid</div>
<div class="right">Right</div>

CSS

.left, .middle, .right {
    float: left;
    height: 50vh;
}
.left, .right {
    width: 30vw;
}
.left {
    background: #1e5799;
}
.middle {
    width: 20vw;
    background: linear-gradient(to bottom right, #1e5799, #1e5799 50%, #207cca 50%, #207cca);
}
.right {
    background: #207cca
}