JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
<div class="container">
  <div class="input-group margin-bottom-sm">
    <span class="input-group-addon"><i class="fa fa-envelope-o fa-fw"></i></span>
    <input class="form-control" type="text" placeholder="Email address">
  </div>
  
  <div class="input-group">
    <span class="input-group-addon"><i class="fa fa-key fa-fw"></i></span>
    <input class="form-control" type="password" placeholder="Password">
  </div>
  
  <div class="input-group margin-bottom-sm">
    <input class="form-control" type="text" placeholder="Email address">
    <span class="input-group-addon"><i class="fa fa-envelope-o fa-fw"></i></span>
  </div>
  
  <div class="input-group">
    <input class="form-control" type="password" placeholder="Password">
    <span class="input-group-addon"><i class="fa fa-key fa-fw"></i></span>
  </div>
</div>

CSS

.input-group {
  margin-top: 10px;
}