JSFiddle - React, Tailwind, and code Playground

HTML

<script src='//code.jquery.com/ui/1.11.2/jquery-ui.js'></script>
<div class="table">
    <div class="inline">
        <img src="https://www.hojko.com/download/file.php?avatar=34394_1376421397.png" />
        <input type="text" />
        <br/>
        <input type="text" />
    </div>
    <div class="inline">
        <img src="https://www.hojko.com/download/file.php?avatar=6028_1325191688.gif" />
        <input type="text" />
        <br/>
        <input type="text" />
    </div>
    <div class="inline">
        <img src="https://www.hojko.com/images/avatars/gallery/baby/baby167.jpg" />
        <input type="text" />
        <br/>
        <input type="text" />
    </div>
    <div class="inline">
        <img src="https://www.hojko.com/download/file.php?avatar=34394_1376421397.png" />
        <input type="text" />
        <br/>
        <input type="text" />
    </div>
    <div class="inline">
        <img src="https://www.hojko.com/download/file.php?avatar=6028_1325191688.gif" />
        <input type="text" />
        <br/>
        <input type="text" />
    </div>
    <div class="inline">
        <img src="https://www.hojko.com/images/avatars/gallery/baby/baby167.jpg" />
        <input type="text" />
        <br/>
        <input type="text" />
    </div>
    <div class="inline">
        <img src="https://www.hojko.com/download/file.php?avatar=34394_1376421397.png" />
        <input type="text" />
        <br/>
        <input type="text" />
    </div>
    <div class="inline">
        <img src="https://www.hojko.com/download/file.php?avatar=6028_1325191688.gif" />
        <input type="text" />
        <br/>
        <input type="text" />
    </div>
</div>

CSS

.table {
    max-width: 335px;
    margin: 0 auto;
}
img {
    max-width: 100%;
    height: auto;
    width: 105px;
}
.inline {
    float: left;
    display: inline-block;
    width: 33.33%;
    width: calc(100%/3);
}
input {
    max-width: 95%;
    height: auto;
    margin: 2px 0;
}
.placeholder{
    display: inline-block;
    width: 33.33%;
    width: calc(100%/3);
	border: 1px red solid;
}

JavaScript

/*
var NewContent1 = '<div class="inline"><img src="https://www.hojko.com/download/file.php?avatar=34394_1376421397.png"/></div>';
$(".table").click(function () {
    $page = $(this);
    $page.append(NewContent1);
});
*/


$(document).ready(function () {
    $(function () {
        $(".table").sortable({
            placeholder: 'placeholder',
            items: 'div'
        }).disableSelection();
    });
});