Bootstrap Input Groups

The .input-group class is used to add text and icons or buttons before or after any text-based input.

Example  of Code

<form>
  <div class="row">
    <div class="col-xs-4">
      <div class="input-group">
      <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
        <input type="text" class="form-control" placeholder="Username">
      </div>
    </div>
    <div class="col-xs-4">
      <div class="input-group">
        <input type="text" class="form-control" placeholder="Amount">
        <span class="input-group-addon">.00</span>
      </div>
    </div>
    <div class="col-xs-4">
      <div class="input-group">
        <span class="input-group-addon">$</span>
        <input type="text" class="form-control" placeholder="US Dollar">
        <span class="input-group-addon">00</span>
      </div>
    </div>
  </div>
</form>

Output