JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
</head>
<body>
    <div class="main">
        <p>asdfghjk</p>
    </div>
    <div class="l">
    </div>
    <div class="r">
    </div>
</body>
</html>

CSS

.main {
    width:100px;
    margin:0 auto;
    background-color:#F0F0F0;
}
.l, .r {
    position:absolute;
    height:100%;
    min-height:100%;
    height:auto !important;
    top:0;
    width:50px;
    background-color:#000;
}
.l {
    left:0;
}
.r {
    right:0;
}