JSFiddle - React, Tailwind, and code Playground

by zachshallbetter

HTML

<div id="example">
    <div id="block-1">First</div>
    <div id="block-2">Second</div>
    <div id="block-3">Third</div>
    <div id="block-4">Fourth</div>
</div>

CSS

#example {display: table; width: 100%; }

#block-1 {display: table-footer-group; } /* Will display at the bottom of pseudo-table */
#block-2 {display: table-caption-group;  } /* Will display in the middle */
#block-3 {display: table-row-group;    } /* Will display in the middle */
#block-4 {display: table-header-group; } /* Will display at the top */