JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://yui.yahooapis.com/3.3.0/build/cssreset/reset-min.css">
<form>
    <h3> LOGIN </h3>
    <p> <label> Username: <input type="text"> </label> </p>
    <p> <label> PIN: <input type="password" class="pin"> </label> </p>
</form>

CSS

p { position:relative; }
input { position:absolute; left:100px; }

/* styling */
body { font:13px sans-serif; margin:30px; }
form { border:3px solid black; width:250px; padding:20px; }
h3 { font-size:20px; font-weight:bold; text-shadow:0 0 2px #ddd; }
p {  margin-top:13px;  }
input { border:1px solid black; width:150px; }
input.pin { width:50px; }