JSFiddle - React, Tailwind, and code Playground

by Sergio Marron

HTML

<div id="up"></div>
<div id="middle">
    
</div>
<div id="down"></div>

CSS

#up {
    width: 100%;
    height: 100px;
    background: lightblue;            
}
#middle{
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    margin-top: -50px;
    left: 0;
    right: 0;
    width: 80%;
    height: 100px;
    background: white;
    border-radius: 5px;
    box-shadow: 0 0 6px #000;
    
    
}

#down {
    height: 100px;
    width: 100%;
    background:salmon;
}