JSFiddle - React, Tailwind, and code Playground

by Khalil Zhang

HTML

<div class="aside-wrapper">
    <aside class="aside aside-header">aside1</aside>
    <aside class="aside aside-footer">asidd2</aside>
</div>
<article class="content">article</article>

CSS

.aside-wrapper {
    position: absolute;
}

.aside {
    width: 100px;
    background-color: red;
}

.aside-header {
    height: 200px;
}

.aside-footer{
    margin-top: 10px;
    height: 100px;
}

.content {
   margin-left: 120px;
    height: 310px;
   background-color: gray;
}