JSFiddle - React, Tailwind, and code Playground

by trickeedickee

HTML

<div id="stylized" class="myform">
        <form id="form" name="form" method="post" action="index.html">
        <h1>Data</h1>
        <div>
        <label>Name: </label>
        <input type="text" name="name" id="name"/>
        </div>
        <div>
        <label>Email: </label>
        <input type="text" name="email" id="email"/>
        </div>
        <div>
        <label>Password: </label>
        <input type="text" name="password" id="password"/>
        </div>
        </form>
    </div>

CSS

.myform{
    margin:0 auto;
    padding:14px;
}
#stylized{
    border-width:1px;
    border-style:solid;
    border-color:#b7ddf2;
    background:#ebf4fb;
}
#stylized h1 {
    font-size:14px;
    font-weight:bold;
    margin-bottom:8px;
    border-width:1px;
    border-style:solid;
    border-color:#b7ddf2;
    padding-bottom:10px;
}
#stylized label{
    display:block;
    font-size:11px;
    font-weight:bold;
    text-align:right;
    float:left;
}
#stylized input{
    float:left;
    font-size:11px;
    padding:4px 2px;
    border:solid 1px #aacfe4;
    width:70px;
    margin:2px 0 20px 10px;
}

#stylized div{
    display: block;
    clear: both;
}