JSFiddle - React, Tailwind, and code Playground

by bg100

HTML

<div style="width: 500px; border: 1px solid red;">
    <table>
        <colgroup>
            <col class="w1" />
            <col class="w2" />
            <col class="w3" />
        </colgroup>
        <thead>
            <tr>
                <th>head1</th>
                <th>head2</th>
                <th>head3</th>
            </tr>
        </thead>
        <tbody>

        </tbody>
    </table>
    <div>My pager controls go here</div>
</div>

CSS

table { width: 100%; min-height: 200px; }
col.w1 { width: 20%; }
col.w2 { width: 30%; }
col.w3 { width: 50%; }