JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<ul id="sortable">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    <li>6</li>
    <li>7</li>
    <li>8</li>
    <li>9</li>
    <li>10</li>
    <li>11</li>
    <li>12</li>
</ul>

CSS

#sortable { 
    list-style-type: none; 
    margin: 0 auto; 
    padding: 0; 
    width: 440px;
}
#sortable li { 
    margin: 0; 
    padding: 0; 
    float: left; 
    width: 16.66%; 
    height: 90px; 
    font-size: 4em; 
    text-align: center; 
    font-weight: bold;
    color: #56a0d3;
    background: #efefef;
    outline: none;
}

JavaScript

$( "#sortable" ).sortable();