JSFiddle - React, Tailwind, and code Playground

HTML

<div id="buttons">
        <input type="button" value="Button One" />
        <input type="button" value="Button Two" />
    </div>
    <table id="mytable">
        <tr>
            <th>Header 1</th>
            <th>Header 2</th>
            <th>Header 3</th>
            <th>Header 4</th>
        </tr>
        <tr class="shadow">
            <td>Row 1, Data 1</td>
            <td>Row 1, Data 2</td>
            <td>Row 1, Data 3</td>
            <td>Row 1, Data 4</td>
        </tr>
        <tr class="shadow">
            <td>Row 2, Data 1</td>
            <td>Row 2, Data 2</td>
            <td>Row 2, Data 3</td>
            <td>Row 2, Data 4</td>
        </tr>
    </table>
    <div id="submit"><input type="button" value="Submit" /></div>

CSS

#mytable {
    width: 100%;
    background-color: #ddd;
}
#mytable tr {
    display: block;
}
#mytable th, #mytable td {
    float: left;
    width: 25%;
    padding: 1em 0;
}
.shadow {
    box-shadow: 0px 0px 10px black;
}

/* clearfix */
#mytable tr:after, .group:after {
    visibility: hidden;
    display: block;
    content: "";
    clear: both;
    height: 0;
}

input {
    padding: 5px;
}
#buttons {
    text-align: right;
    padding: 1em;
}
#submit {
    text-align: center;
    padding: 1em;
}