Bootstrap .iconic-input examples
HTML
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">
<form class="form-inline" role="form">
<div class="row">
<div class="form-group col-sm-3">
<button type="button" class="btn btn-info" onclick="getAmount(10)">$10</button>
<button type="button" class="btn btn-info" onclick="getAmount(5)">$5</button>
<button type="button" class="btn btn-info" onclick="getAmount(1)">$1</button>
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-envelope-o fa-fw"></i></span>
<input type="email" class="form-control" placeholder="Enter email" />
<div class="input-group-addon">.00</div>
</div>
</div>
<div class="form-group col-sm-3">
<div class="input-group"> <span class="input-group-addon"><i class="fa fa-key fa-fw"></i></span>
<input type="password" class="form-control" placeholder="Choose password" />
</div>
</div>
<button type="submit" class="btn btn-default">Create account</button>
</div>
</form>