JSFiddle - React, Tailwind, and code Playground

Fixed Column

HTML

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/fixedcolumns/3.2.0/css/fixedColumns.dataTables.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/fixedcolumns/3.2.2/js/dataTables.fixedColumns.min.js"></script>
<table id="sample">
<thead>
  <tr>
    <th>1</th>
    <th>1</th>
    <th>1</th>
    <th>1</th>
    <th>1</th>
    <th>1</th>
    <th>1</th>
    <th>1</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
  </tr>
  <tr>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
  </tr>
  <tr>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td>2</td>
  </tr>
</tbody>
</table>

JavaScript

$("#sample").DataTable({
"sDom": '<lf<"#gobutton"><"#actions"><t>ip<"clear"<".offeringstableactions">>>',
        orderCellsTop: false,
		
    "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
    drawCallback:function(){
    	console.log("Table is created");
    }    
});