JSFiddle - React, Tailwind, and code Playground

by Giba Nasser

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<form>

  <div class="form-group"><div class="col-xs-4">
    <label class="control-label" for="input1">Input1</label>
    <input type="text" class="form-control" id="input1" name="input1">
  </div></div>

  <div class="form-group"><div class="col-xs-4">
    <label class="control-label" for="input2">Input2</label>
    <div class="input-group">
    <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
    <input type="text" class="form-control" id="input2" name="input2">
    </div>
  </div></div>

  <div class="form-group"><div class="col-xs-4">
    <label class="control-label" for="input3">Input3</label>
    <input type="text" class="form-control" id="input3" name="input3">
  </div></div>

  <div class="form-group"><div class="col-xs-4">
    <label class="control-label" for="input4">Input4</label>
    <input type="text" class="form-control" id="input4" name="input4">
  </div></div>

  <div class="form-group"><div class="col-xs-4">
    <label class="control-label" for="input5">Input5</label>
    <div class="input-group">
    <span class="input-group-addon">Go!</span>
    <input type="text" class="form-control" id="input5" name="input5">
    </div>
  </div></div>

  <div class="form-group"><div class="col-xs-4">
    <label class="control-label" for="input6">Input6</label>
    <input type="text" class="form-control" id="input6" name="input6">
  </div></div>

  <div class="form-group"><div class="col-xs-4">
    <label class="control-label" for="input7">Input7</label>
    <input type="text" class="form-control" id="input7" name="input7">
  </div></div>

  <div class="form-group"><div class="col-xs-4">
    <label class="control-label" for="input8">Input8</label>
    <input type="text" class="form-control" id="input8" name="input8">
  </div></div>

</form>