JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="ru" >
<head>
  <meta charset="utf-8" />
</head>
<body>
  <div id="footer">footer</div>
  <div id="header">header</div>
  <div id="wrapper">
    <div id="content" class="min_height">
      <div class="sidebar-left min_height">sidebar left</div>
      <div id="center" class="min_height">
        <div id="main-content">
         м<br/>н<br/>о<br/>г<br/>о<br/> р<br/>а<br/>з<br/>н<br/>ы<br/>х<br/> б<br/>у<br/>к<br/>в<br/>
         м<br/>н<br/>о<br/>г<br/>о<br/> р<br/>а<br/>з<br/>н<br/>ы<br/>х<br/> б<br/>у<br/>к<br/>в<br/>
         м<br/>н<br/>о<br/>г<br/>о<br/> р<br/>а<br/>з<br/>н<br/>ы<br/>х<br/> б<br/>у<br/>к<br/>в<br/> 
        </div>
      </div>
      <div class="sidebar-right min_height">sidebar right</div>
    </div>
  </div>
</body>
</html>

CSS

* { margin:0; padding:0}
  body { width:100%; height:100%; background:#CCC;}
  #wrapper { width:1000px; height:100%; margin:0 auto;}
  #header { width:100%; height:200px; position:absolute; top:0; background:#EEE;}
  #content { width:1000px; position:absolute; top:200px; bottom:200px; background:#999;}
  .sidebar-left, .sidebar-right {float: left; width: 200px; height: 100%;}
  #center { width:600px; height:100%; float:left; margin:0 auto; overflow:auto; background:#FFF;}
  .min_height { min-height:200px;}
  #footer { width:100%; height:200px; position:absolute; bottom:0; background:#666;}