JSFiddle - React, Tailwind, and code Playground

by Dhanck

HTML

<div class="container">
  <div class="header"></div>
  
  <div class="small-box"></div>
  <div class="small-box"></div>
  <div class="small-box"></div>
  <div class="sidebar"></div>
  <div class="main"></div>
  <div class="footer"></div>
</div>

CSS

.container{
  width: 1000px;
  display: flex;
  margin: 0 auto;
}
.header, .footer{
  height: 100px;
  background: red;
  width: 100%;
}
.small-box{
  height: 100px;
  background: red;
  width: 25%;
}