JSFiddle - React, Tailwind, and code Playground
HTML
<div class="center">
<div class="nav">nav</div>
<div class="left">
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<div class="left-el">left-el</div>
<!--.....->
</div>
<div class="right">right</div>
</div>
CSS
.center {
width: 400px;
background-color: red;
margin: 0 auto;
}
.nav {
width: 400px;
height: 30px;
background-color: yellow;
}
.left, .right {
width: 150px;
display: inline-block;
vertical-align: top;
}
.left {
background-color: green;
}
.right {
background-color: blue;
height: 40px;
}