JSFiddle - React, Tailwind, and code Playground

HTML

<div class='container'>
  <div class='header'>
  <h1>шапка</h1>
  </div>

  <div class='left-menu'>
  <h1>сено</h1>
  </div>

  <div class='right-menu'>
  <h1>солома</h1>
  </div>

  <div class='content'>
  <h1>центр</h1>
  </div>

  <div class='footer'>
  <h1>подвал</h1>
</div>
</div

CSS

.container {
width: 900px;
margin: 0 auto;
}

.header {
text-align: center;
width: 900px;
margin: 0 auto;
border: 3px solid red;
margin: 20px;
}
.left-menu {
width: 200px; 
height: 700px;
border: 3px solid yellow;
float: left;
padding: 5px;
}
.right-menu {
width: 201px; 
height: 700px;
float: right;
border: 3px solid black;
}
.content {
height: 700px;
margin: 0 205px 0 216px;
padding: 5px;
border: 3px solid green;
}
.footer {
width: 900px;
clear: both;
padding: 5px;
border: 3px solid blue;
}