JSFiddle - React, Tailwind, and code Playground

HTML

<div id="dt"></div>

CSS

table{
table-layout:fixed;
}

JavaScript

YUI().use("datatable", "node",'dd-drag', 'dd-proxy', 'dd-plugin', 'resize', 'resize-plugin', 'resize-constrain',
    function(Y) {
    var thNodeList, table, data =[
       {dnum:100, dint:1, dtxt:"Test 1 string", dname:"George"},
       {dnum:101, dint:2, dtxt:"Test 2 string", dname:"Paul"},
       {dnum:102, dint:3, dtxt:"Test 3 string", dname:"Chase"},
       {dnum:103, dint:4, dtxt:"Test 4 string", dname:"Marge"},
       {dnum:104, dint:5, dtxt:"Test 5 string", dname:"Ben"},
       {dnum:105, dint:6, dtxt:"Test 6 string", dname:"Skyler"},
       {dnum:106, dint:7, dtxt:"Test 7 string", dname:"Lara"}
    ];
        
    Y.one('body').addClass("yui3-skin-sam");               
    table = new Y.DataTable({
        columns:[ 'dnum', 
                  {key: 'dint', editable: true}, 
                  {key: 'dtxt', editable: true}, 
                  {key: 'dname', editable: true} ],
        data: data
    }).render('#dt');
        
   thNodeList = Y.all('th');
   thNodeList.setStyle('position', 'relative');
   thNodeList.plug(Y.Plugin.Resize, { handles: 'r' });
});