JSFiddle - React, Tailwind, and code Playground

by Thomas Upton

HTML

<script src="https://rawgit.com/RubaXa/Sortable/0.5.2/Sortable.min.js"></script>
<div id="container">
    <div class="box"><div class="handle">+</div> 1  Lorem ipsum dolor sit amet, consectetur adipiscing elit. In tempor urna ut mauris euismod suscipit. Praesent tristique et mauris ac efficitur. Mauris augue diam, tincidunt eget diam sed, iaculis molestie quam. Nullam consectetur neque id odio dapibus consequat. Vestibulum mollis facilisis arcu eget vulputate. Ut eu leo et magna semper auctor. Nullam lacinia sed diam nec dignissim. Donec metus massa, dictum at dignissim sit amet, rhoncus eu quam. Interdum et malesuada fames ac ante ipsum primis in faucibus. Morbi tincidunt mauris risus, ut venenatis lorem venenatis vitae. Quisque convallis mattis diam, eget maximus tortor. In tincidunt vitae metus vitae efficitur. Donec velit nulla, tempor id ornare in, viverra at dui. Aenean eu nisi in neque cursus sollicitudin.

Aenean consectetur rutrum enim. Vestibulum varius, lorem eu pulvinar consequat, arcu mi aliquet arcu, eu vulputate tellus leo nec tellus. Nulla suscipit, augue non rutrum sollicitudin, lectus orci ultrices nunc, in venenatis turpis turpis in sapien. Curabitur iaculis turpis sed dui interdum rhoncus in sed mauris. Nunc sem tellus, pulvinar a odio sed, condimentum porttitor lectus. Pellentesque dapibus finibus lorem. Maecenas convallis a eros et lobortis. Nullam nec felis vitae nisl sagittis porta. Morbi quis massa non nisl pellentesque varius ut a orci. Vivamus fermentum efficitur felis, non convallis arcu dignissim quis. Morbi commodo bibendum quam, sed placerat metus volutpat non.

Vivamus at velit ac sem blandit ullamcorper. Nulla sollicitudin, ex ac commodo venenatis, sem purus tempus nisl, in sagittis erat nunc vitae ante. Mauris et hendrerit sem. Fusce fringilla auctor ex, eu euismod lectus scelerisque et. Donec luctus odio mauris, sit amet aliquam arcu gravida egestas. Nam sit amet mi dignissim felis placerat iaculis ac volutpat sapien. Mauris non...

CSS

#container {
    width: 600px;
    height: 650px;
    border: 1px solid black;
}

.box {
    width: 200px;
    height: 200px;
    border: 1px solid red;
    display: inline-block;
    overflow-y: auto;
}

JavaScript

var s = new Sortable(document.getElementById('container'), {
    draggable: '.box'
});