JSFiddle - React, Tailwind, and code Playground

by Ryan Mitchell

HTML

<div class="left">Left content</div>
<div class="middle">Middle</div>
<div class="right">Right</div>

CSS

* {
   padding: 0;
    margin: 0
}

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