JSFiddle - React, Tailwind, and code Playground

HTML

<div style="height: 100%">
<div id="Header"></div>
  <div id="container">
       <div id="sidebar"></div>
        <div id="content">fff</div>
  </div>
</div>

CSS

html, body {margin:0;padding:0;height:100%; width: 100%;}
#Header{
    height: 30px;
    background-color: yellow;
}
#container{

    height: 100%;
    width: 100%;
 
}
#sidebar{ 
  
    background-color: orange;  
    height: 100%;
    float:left;
    opacity: 0.7;
    width: 240px;

}
#content{
    background-color: blue; 
    height:100%;
    float: left;


  
     
 
  
}