JSFiddle - React, Tailwind, and code Playground

by Divy Shah

HTML

<div class="container">
    <div class="side">Left</div>
    <div class="middle">.</div>
    <div class="side">Right</div>
</div>

CSS

div.container {
    width: 100%;
    display: block; /* Changed from display:table; */
}
div.container > * {
    display: inline-block; /* Changed from display:table-cell; */
    float:left; /* Added floating to avoid space between elements */
}
div.middle {
    width: 100%; 
    max-width: 500px;
    background-color: black;
}
div.side {
    width: auto;
    background-color: chocolate;
}