JSFiddle - React, Tailwind, and code Playground

by luka kupunia

HTML

<div id="demo">
    <div>1</div>
    <div>2</div>
</div>

CSS

body {
    margin: 0;
}
* {
    box-sizing: border-box;
}
#demo {
    display: flex;
    justify-content: space-between;
    animation: a 1s 1s both;
}
div:not(#demo) {
    width: 100px;
    height: 100px;
    background: red;
    transition: 1s;
}
@keyframes a {
    100% {
        justify-content: center;
        flex-direction: row-reverse;
    }
}