JSFiddle - React, Tailwind, and code Playground
by bvotcode
HTML
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<link href="http://fontawesome.io/assets/font-awesome/css/font-awesome.css" rel="stylesheet" media="screen">
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" type="text/css" rel="stylesheet">
<!-- FORM -->
<div class="col-md-12">
<form class="form-horizontal" id="form-edit-client">
<fieldset>
<!-- Form Name -->
<legend>Client</legend>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="client-name">Name</label>
<div class="col-md-4">
<input id="client-name" name="client-name" type="text" placeholder="your client's name" class="form-control input-md">
<span class="help-block">Full name of your customer</span>
</div>
</div>
<!-- Prepended text-->
<div class="form-group">
<label class="col-md-4 control-label" for="client-email">Email</label>
<div class="col-md-4">
<div class="input-group">
<span class="input-group-addon">@</span>
<input id="client-email" name="client-email" class="form-control" placeholder="[email protected]" type="text">
</div>
<p class="help-block">Email of your client</p>
</div>
</div>
<!-- Multiple Radios -->
<div class="form-group">
<label class="col-md-4 control-label" for="client-status">Client status</label>
<div class="col-md-4">
<div class="radio">
<label for="client-status-0">
<input type="radio" name="client-status" id="client-status-0" value="active" checked="checked">
Active
</label>
</div>
<div class="radio">
<label for="client-status-1">
<input type="radio" name="client-status"...