JSFiddle - React, Tailwind, and code Playground

by luka kupunia

HTML

<script src="https://refreshless.com/nouislider/distribute/nouislider.js?v=1410"></script>
<link rel="stylesheet" href="https://refreshless.com/nouislider/distribute/nouislider.css?v=1410">
<div id="box">
    <div>
        fwefewLorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam placeat, id? Quasi voluptates molestias officiis! Vel, voluptas. Saepe eum omnis eveniet harum tempora laudantium dicta, distinctio repudiandae accusantium. Laboriosam, tempore. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam voluptates ad libero omnis, expedita iusto inventore in quod ex! Vel ea modi ipsa perspiciatis magni asperiores similique sed, dolore praesentium.
    </div>
    <div>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam placeat, id? Quasi voluptates molestias officiis! Vel, voluptas. Saepe eum omnis eveniet harum tempora laudantium dicta, distinctio repudiandae accusantium. Laboriosam, tempore. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam voluptates ad libero omnis, expedita iusto inventore in quod ex! Vel ea modi ipsa perspiciatis magni asperiores similique sed, dolore praesentium.
    </div>
    <div>
        fwefwe
    </div>
</div>

CSS

body {
    margin: 0;
}
#box {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
#box div {
    border: 1px solid black;
    margin: 0 20px;
}
#box div:first-child {
    margin-left: 0;
}
#box div:last-child {
    margin-right: 0;
}