JSFiddle - React, Tailwind, and code Playground

by agib

HTML

<div class="header" >
    &nbsp;
</div>
<div class="left-sidebar" >
    left sidebar
</div>
<div class="mainBody">
    &nbsp;
    <div class="content" >Hello worldHello worldHello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world...

CSS

body {
    margin:0;
}

.header {
    height: 40px;
    background-color: red;
}

.left-sidebar {
   position: absolute;
    width: 300px;
    left: 0;
    top: 40px;
    bottom: 20px;
    height: 100%;
    background-color: green;
    z-index: 100;
}

.mainBody {
    background-color: yellow;
    position: absolute;
    top: 40px;
    bottom: 20px;
    left: 300px;
    height: 100%;
    width: 100%;
    overflow-y: scroll;
}

.footer {
    height: 20px;
    background-color: blue; 
    position: absolute;
    bottom: 0;
    width:100%;
}