JSFiddle - React, Tailwind, and code Playground

by Naeel Maqsudov

HTML

<div id="all">
    <div id="leftpan">
        123 123234 52345 234 52 34 5234 2345
    </div>
    <div id="content">
        asdfasdf askjdhf aksj hfksj hfdkasj hfdksjdfh aksjdhf aksjdhf aksjdf haksjdhf ksjhf kj hfekjrhf ekjr hfwkejr hfkjr hfkjsdhf aksjdhf aksjdfh aksjdhf kwejrh fkwejr hfkjeh rfkjefh kasjdhf aksjdhf ksjdhf kejhr fkwej hfkj hfaksjdfh aksjdf hkjwehf kejw hfksjd fhasdfjhkwje hfkqwjehf kwjhf kjdhf k hfqk hfdqkwj hfqkwj hfdqkjw hfqkwj ehfqwef kjhfd kasjdhf ksjd hfksjd hfskj hfksjf hdkfjhv kdjfhv kdjf mhvkjdf hvwkejrh wkjerhfkwejfhsdkfhsidfh isdjhf skjfh sjdf hksjdf hskdj fsdf
    </div>
    
</div>

CSS

div{
    border: 1px solid red;
}
#all{
    overflow:hidden;
    position:relative;
}
#leftpan,#content{
    position: relative;
    float:left;
    --height: 60px;
}
#leftpan{
     position: absolute;
    background:color
    width: 20%;
    left: -10%;
    --height: 100%;
}
#content{
    --width: 79%;
    --display: none;
}