JSFiddle - React, Tailwind, and code Playground

by Ravindra Athreya

HTML

<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.10.3/themes/ui-lightness/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<div class="container">
    <div id="sortable" class="row">
        <div class="col-lg-2 col-md-3 col-sm-4 col-xs-4">
            <div class="panel panel-default">
                <div class="panel-heading">Test 1</div>
                <div class="panel-body">Content</div>
            </div>
        </div>
        <div class="col-lg-2 col-md-3 col-sm-4 col-xs-4">
            <div class="panel panel-default">
                <div class="panel-heading">Test 2</div>
                <div class="panel-body">Content</div>
            </div>
        </div>
        <div class="col-lg-2 col-md-3 col-sm-4 col-xs-4">
            <div class="panel panel-default">
                <div class="panel-heading">Test 3</div>
                <div class="panel-body">Content</div>
            </div>
        </div>
        <div class="col-lg-2 col-md-3 col-sm-4 col-xs-4">
            <div class="panel panel-default">
                <div class="panel-heading">Test 4</div>
                <div class="panel-body">Content</div>
            </div>
        </div>
        <div class="col-lg-2 col-md-3 col-sm-4 col-xs-4">
            <div class="panel panel-default">
                <div class="panel-heading">Test 5</div>
                <div class="panel-body">Content</div>
            </div>
        </div>
        <div class="col-lg-2 col-md-3 col-sm-4 col-xs-4">
            <div class="panel panel-default">
                <div class="panel-heading">Test 6</div>
                <div class="panel-body">Content</div>
            </div>
        </div>
  ...

CSS

#sortable > div {
    border-top: 1px solid transparent;
     margin-right:-1px;
}

JavaScript

$(function () {
    $("#sortable").sortable();
    $("#sortable").disableSelection();
});