JSFiddle - React, Tailwind, and code Playground

HTML

<div id="header">

</div>

<div id="container">
  <div class="col" id="col1">
      content<br/>
      content<br/>
  </div>
  <div class="col" id="col2">
      content<br/>
      content<br/>
      content<br/>
      content<br/>
      content<br/>
      content<br/>
      content<br/>
  </div>
  <div class="col" id="col3">
      content<br/>
      content<br/>
      content<br/>
      content<br/>
  </div>
  <div style="clear:left;"></div>
</div>

<div id="footer">
  
</div>

CSS

body, html{
  height:100%;  
  background-color:white;
}
#container {
  background: linear-gradient(to right, #cccccc 0%,#cccccc 20%,#ffffff 20%,#ffffff 80%,#deccde 80%,#deccde 100%);
}
#header{
  height:100px;
  width:100%;
}

#footer{
  height:100px;
  width:100%;
}

.col{
   float:left;
   height:100%;
 }
 
 #col1{
    width:20%;  
 }
 
  #col2{
    width:60%;
 }
 
  #col3{
    width:20%;  
 }