JSFiddle - React, Tailwind, and code Playground

by clayshannon

HTML

<label class="fixedwidthlbl" for="city">City</label>
<input type="text" name="city" id="city">
<br/>
<label class="fixedwidthlbl" for="state">State</label>
<input type="text" name="state" id="state">
<br/>
<label class="fixedwidthlbl" for="yearin">Year Arrived</label>
<input type="text" name="yearin" id="yearin">
<br/>
<label class="fixedwidthlbl" for="yearout">Year Departed</label>
<input type="text" name="yearout" id="yearout">
<br/>
<input type="submit" name="insertdocument" id="insertdocument" value="Add Place Lived">
<table>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
    </tr>
    <tr>
        <td colspan="4">
            <input type="text" style="width:100%">
        </td>
        <td>5</td>
    </tr>
    <tr>
        <td colspan="4">
            <textarea style="width:100%"></textarea>
        </td>
        <td>5</td>
    </tr>
</table>

CSS

.fixedwidthlbl {
    width: 320px;
    padding: 2 px;
}
input {
    margin: 4px;
    padding: 4px;
}
td {
    border: 1px solid red;
    width: 100px;
    height:50px;
    text-align:center;
}