JSFiddle - React, Tailwind, and code Playground
by odrelon
HTML
<form>
<caption>Form With Bootstrap</caption>
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
<input type="text" class="form-control" placeholder="Enter Your name" />
</div>
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
<input type="password" class="form-control" placeholder="Enter Password" />
</div>
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
<input type="password" class="form-control" placeholder="Re-Enter Password" />
</div>
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
<input type="date" class="form-control"/>
</div>
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-upload"></span></span>
<input type="file" class="form-control" />
</div>
<div class="input-group">
<input type="text" class="form-control" placeholder="Contect Number" maxlength="10" min="10" />
<span class="input-group-addon"><span class="glyphicon glyphicon-phone"></span></span>
</div>
<div class="input-group">
<span class="input-group-addon"><a href="#"><span class="glyphicon glyphicon-fast-backward"></span></a></span>
<input type="text" class="form-control" />
<span class="input-group-addon"><a href="#"><span class="glyphicon glyphicon-fast-forward"></span></a></span>
</div>
<br />
<button type="Submit" class="btn btn-success">
<span class="glyphicon glyphicon-cloud-upload">...
CSS
body
{
background-color:#CCC;
}
form
{
Width:400px;
height:500px;
border-color:#000;
margin-left:200px;
text-align:center;
color:#003;
}