JSFiddle - React, Tailwind, and code Playground

HTML

<div id="first"></div>
<div id="second"></div>
<div id="third"></div>
<div id="fourth"></div>

CSS

div{width: 200px; height: 100px; background-color: red; margin: 10px;}

#third{background-color: green;}

body {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
}

#first,
#third {
    -webkit-order: -1;
    order: -1;
}

#second,
#third,
#fourth {
    margin-top: 0; // margin-collapsing won't work anymore
}