JSFiddle - React, Tailwind, and code Playground

by Praveen Kumar Purushothaman

HTML

<form action="" method="post">
    <ul>
        <li><label><strong>Username</strong><input type="text" name="username" /></label></li>
        <li><label><strong>Password</strong><input type="password" name="password" /></label></li>
        <li><input type="submit" value="Sign In" /></li>
    </ul>
</form>

<form action="" method="post">
    <ul>
        <li><label><strong>Username</strong><input type="text" name="username" /></label></li>
        <li><label><strong>Password</strong><input type="password" name="password" /></label></li>
        <li><label><strong>Confirm Password</strong><input type="password" name="confpass" /></label></li>
        <li><label><strong>Email</strong><input type="text" name="email" /></label></li>
        <li><input type="submit" value="Sign Up" /></li>
    </ul>
</form>

CSS

* {font-family: sans-serif; font-size: 10pt; margin: 0; padding: 0; list-style: none;}
form {width: 50%; float: left;}
form li {padding: 5px;}
form li label strong {display: inline-block; width: 80px;}
form li > input {padding: 2px 10px; margin-left: 80px;}