JSFiddle - React, Tailwind, and code Playground

HTML

Table version:<br/>
<table id="sortTable">
    <tbody class="sortme" >
        <tr><td>Foo</td></tr>
        <tr><td>Bar</td></tr>
        <tr><td>Really long and annoying table row, try to sort me!</td></tr>
    </tbody>
</table>
<br/>
Div version:<br/>
<div class="sortme" id="sortDiv" style="display: inline-block">
    <div>Foo</div>
    <div>Bar</div>
    <div>Really long and annoying table row, try to sort me bigger!</div>
</div>

CSS

.sortme {
    background: yellow;
}

JavaScript

$(document).ready(function() {
    var width = $('.sortme div').width();
    $('#sortDiv').width(width);
    var width2 = $('.sortme tr td').width();
    $('#sortTable').width(width2);
    
    $(".sortme").sortable({
        containment: "parent",
        tolerance: "pointer"
    }).disableSelection();
});