JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<form role="form">
    <div class="form-group has-feedback">
        <label class="control-label" for="inputSuccess2">Input with success</label>
        <div class="input-group">
            <span class="input-group-addon">@</span>
            <input type="text" class="form-control" id="inputSuccess2" aria-describedby="inputSuccess2Status">
            <span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true"></span>
            <span id="inputSuccess2Status" class="sr-only">(success)</span>
        </div>
    </div>
</form>

<form class="form-horizontal" role="form">
    <div class="form-group has-feedback">
        <label class="control-label col-sm-3" for="inputSuccess3">Input with success</label>
        <div class="col-sm-9">
            <div class="input-group">
                <span class="input-group-addon">@</span>
                <input type="text" class="form-control" id="inputSuccess2" aria-describedby="inputSuccess2Status">
                <span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true"></span>
                <span id="inputSuccess2Status" class="sr-only">(success)</span>
            </div>
        </div>
    </div>
</form>
    
<form class="form-horizontal" role="form">
    <div class="form-group has-feedback">
        <label class="control-label col-sm-3" for="inputSuccess3">Input with success</label>
        <div class="col-sm-9">
            <div class="input-group">
                <span class="input-group-addon">@</span>
                <input type="text" class="form-control" id="inputSuccess2" aria-describedby="inputSuccess2Status">
            </div>
            <span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true"></span>
            <span id="inputSuccess2Status" class="sr-only">(success)</span>
        </div>
    </div>
</form>