JSFiddle - React, Tailwind, and code Playground

by Timebreaker900

HTML

<link rel="stylesheet" href="//cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css">
<script src="//cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.8.0/bootstrap-table.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.8.0/bootstrap-table.min.css">
<div id="exTab1" class="container">	
  <ul  class="nav nav-pills">
			<li class="active" id="test1">
        <a  href="#1a" data-toggle="tab">Overview</a>
			</li>
			<li id="test2"><a href="#2a" data-toggle="tab">Using nav-pills</a>
			</li>
			<li><a href="#3a" data-toggle="tab">Applying clearfix</a>
			</li>
  		<li><a href="#4a" data-toggle="tab">Background color</a>
			</li>
	</ul>
    
    <div class="tab-content clearfix">
			  <div class="tab-pane active" id="1a">
          <table cellpadding="0" cellspacing="0" border="0" class="row-border" id="table1">
            <thead>
                <th>TestHeader1</th>
                <th>TestHeader2</th>
                <th>TestHeader3</th>
            </thead>
            <tbody>
              <tr>
                <td>Content1</td>
                <td>Content2</td>
                <td>Content3</td>
              </tr>
              <tr>
                <td>Content1</td>
                <td>Content2</td>
                <td>Content3</td>
              </tr>
              <tr>
                <td>Content1</td>
                <td>Content2</td>
                <td>Content3</td>
              </tr>
              <tr>
                <td>Content1</td>
                <td>Content2</td>
                <td>Content3</td>
              </tr>
              <tr>
                <td>Content1</td>
                <td>Content2</td>
               ...

JavaScript

var table1 = $('#table1').DataTable();

var table2 = $('#table2').DataTable();

/* $('#test1').click(function() {
  table1.columns.adjust();
});

$('#test2').click(function() {
  table2.columns.adjust();
}); */