JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
  <div id="left">
    <p>Some Left Stuff goes here</p>
    <p>Some Left Stuff goes here</p>
    <p>Some Left Stuff goes here</p>
    <p>Some Left Stuff goes here</p>
    <p>Some Left Stuff goes here</p>
    <p>Some Left Stuff goes here</p>
    <p>Some Left Stuff goes here</p>
    <p>Some Left Stuff goes here</p>
  </div>
  
  <div id="main">
    sdfdsf
  </div>
  
  <div id="right">
    <p>Some Right Stuff goes here</p>
    <p>Some Right Stuff goes here</p>
    <p>Some Right Stuff goes here</p>
    <p>Some Right Stuff goes here</p>
    <p>Some Right Stuff goes here</p>
    <p>Some Right Stuff goes here</p>
    <p>Some Right Stuff goes here</p>
  </div>
  
  <footer>
    Here is your footer
  </footer>
</div>

CSS

#left {
  float: left;
  width: 25%;
  background-color: aqua;
}

#main {
  float: left;
  width: 50%;
  background-color: lightgray; 
}

#right {
  float: right;
  width: 25%;
  background-color: yellow;
}



footer {
  width: 50%;
  float: left;
  background-color: red;
}