JSFiddle - React, Tailwind, and code Playground

by Ratan Paul

HTML

<script src="http://rommelsantor.com/jquery/thfloat/jquery.thfloat-0.6.min.js"></script>
    <table id="maintable" cellpadding="0" cellspacing="0">
        <thead>
            <tr>
                <th>Col 1</th>
                <th>Col 2</th>
                <th>Col 3</th>
                <th>Col 4</th>
                <th>Col 5</th>
                <th>Col 6</th>
                <th>Col 7</th>
                <th>Col 8</th>
                <th>Col 9</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>This is a long column</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
            </tr>
            <tr>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
            </tr>
            <tr>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>This is a much longer column with lots of information</td>
                <td>info</td>
            </tr>
            <tr>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
            </tr>
            <tr>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
                <td>info</td>
   ...

CSS

th{
    background-color:whitesmoke;
}

JavaScript

//fixed header
$("#maintable").thfloat();