JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<table class="faq_container expandedT ww" id="sortable1" style='width:300px;'>
    <thead not-sortable>
    <tr>
        <td class="faq_glyph_owner"></td>
        <td class="faq_glyph_owner"></td>
        <td class="faq_text"></td>
        <td class="faq_glyph_owner"></td>
    </tr>
    </thead>
    <tbody not-sortable class="faq_title_container" style='width:300px;'>
    <tr class="faq_title">
        <td></td>
        <td colspan="2">Here is title</td>
        <td></td>
    </tr>
    </tbody>
    <tbody id="2" class="faq_question_container expandedQ" style='width:300px'>
    <tr class="faq_question">
        <td></td>
        <td></td>
        <td style='width:300px;'>question oneasddddddddddddddddddddddddddddddddddddddddddd</td>
        <td></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td colspan="2">sub question</td>
    </tr>
    </tbody>
    <tbody id="3" class="faq_question_container expandedQ">
    <tr class="faq_question">
        <td></td>
        <td></td>
        <td>question oneasdd</td>
        <td></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td colspan="2">sub question</td>
    </tr>
    </tbody>
</table>

CSS

table tr{
  border : thin solid black;
    border-collapse: collapse;
}
table{
  border-collapse : collapse;
}

JavaScript

jQuery("#sortable1").sortable({
        items: "tbody:not([not-sortable])",
        cursor: "move",
        zIndex: 9999,
        start: function (event, ui) {
            /*var colW = jQuery(".faq_glyph_owner").width();
            self.textWidth = ui.item.innerWidth() - colW * 3;
            jQuery(".faq_text").width(self.textWidth);
            jQuery("#sortable1").css("table-layout", "fixed");
            ui.item.find("div").parent().width(self.textWidth + colW);*/
        },
        stop: function (event, ui) {
            //jQuery("#sortable1").css("table-layout", "auto");
        },
        helper: fixedWidth
    });
    
    function fixedWidth(e, ui) {
        var max_w = 0;
        // get the max width from all the children
        ui.children().each(function() {
        		var w = $(this).width();
            if (w > max_w) max_w = w;
        });
        // set the width of the table to be the max
        $('#sortable1').width(max_w);
        return ui;    		
    }