JSFiddle - React, Tailwind, and code Playground

HTML

<div id="Container">
    
    <div id="mainColumn">
        <div style="width:80%;" class="sortableItem">
            Item 1 needs 80% width
        </div>
         <div style="width:100%;" class="sortableItem">
            Item 2 needs 100% width
        </div>
        
         <div style="width:50%;" class="sortableItem">
            Item 3 needs 50% width
        </div>
    </div>      
</div>

CSS

#Container
{
    width:800px
        
}

#mainColumn{
    margin-right:280px;
}

.sortableItem{
    border: 1px dashed #ccc;
    margin:10px;
}

JavaScript

$(document).ready(function(){  
$('#mainColumn').sortable({
 items:'.sortableItem'
});
    
});