JSFiddle - React, Tailwind, and code Playground

HTML

<form id="person">
    <ul>
        <li><label for="name">Name: </label><input id="name" name="name" type="text" /></li>
        <li><label for="age">Age: </label><input id="age" name="age" type="text" /></li>
        <li><label for="n">N: </label><input id="n" name="n" type="text" /></li>
    </ul>
</form>

CSS

body {
    font-family: Arial, sans-serif;
    font-size: 12px;
}

#person ul {
    list-style: none;
}

#person li {
    padding: 5px 10px;
}

#person li:hover {
    background-color: #f0f0f0;
}

#person li label {
    float: left;
    width: 50px;
    margin-top: 3px;
}

#person li input[type="text"] {
    border: 1px solid #999;
    padding: 3px;
    width: 180px;
}