JSFiddle - React, Tailwind, and code Playground

HTML

<div class="frame">
    <table border="1" width="100%">
        <tr>
            <td>Nam luctus</td>
            <td>Nam luctus sem sit amet</td>
            <td>Nam luctus sem sit amet fermentum tincidunt</td>
            <td>Nam luctus</td>
            <td>Nam luctus sem sit amet</td>
            <td>Nam luctus sem sit amet fermentum tincidunt</td>
            <td>Nam luctus</td>
            <td>Nam luctus sem sit amet</td>
            <td>Nam luctus sem sit amet fermentum tincidunt</td>
            <td>Nam luctus</td>
            <td>Nam luctus sem sit amet</td>
            <td>Nam luctus sem sit amet fermentum tincidunt</td>
            <td>Nam luctus</td>
            <td>Nam luctus sem sit amet</td>
            <td>Nam luctus sem sit amet fermentum tincidunt</td>
            <td>Nam luctus</td>
            <td>Nam luctus sem sit amet</td>
            <td>Nam luctus sem sit amet fermentum tincidunt</td>
            <td>Nam luctus</td>
            <td>Nam luctus sem sit amet</td>
            <td>Nam luctus sem sit amet fermentum tincidunt</td>
            <td>Nam luctus</td>
            <td>Nam luctus sem sit amet</td>
            <td>Nam luctus sem sit amet fermentum tincidunt</td>
        </tr>
        <tr>
            <td colspan="24" class="gray-bar">
                Edit | Delete
            </td>
        </tr>
    </table>
</div>

CSS

.frame{
    overflow-x: scroll;
    width:100%;
    }
.gray-bar{
    background:#cdcdcd;
    padding:6px 0;
    width:100%;
    height: 20px;
    clear:both;
    }