JSFiddle - React, Tailwind, and code Playground

by NickMDG

HTML

<form action="" method="post">
    <fieldset>
        <legend>Simple HTML 5 Form Validation</legend>
        <div>
            <label for="name">Name:</label>
            <input id="name" name="name" value="" required>
        </div>
        <div>
            <label for="email">Email:</label>
            <input type="email" id="email" name="email" value="" required>
        </div>
        <div>
            <label for="phone">Phone:</label>
            <input type="phone" id="phone" name="phone" value="" required>
        </div>
        <div>
            <label for="website">Website:</label>
            <input type="url" id="website" name="website" value="" required>
        </div>
        <div class="submit">
            <input type="submit" value="Submit">
        </div>
    </fieldset>
</form>

CSS

form{font-family:Arial; font-size:14px;}
fieldset{padding:20px;}
fieldset div{padding:10px;}
input{min-width:200px; height:30px; border-radius:4px; border:1px #ccc solid;}
label{min-width:100px; display:inline-block;}
.submit input{min-width:auto;}