How to set text right after textbox twitter bootstrap

Question

I have a form elements using the following markup.. And the current look of the form you can find in the following screenshot:

How can I set the "In" and"Lbs" right after their corresponding textbox?

<div class="form-group">
    <label for="BI16" class="col-md-1 col-md-offset-1 control-label">Height:</label>
    <div class="col-md-1">
        <input type="text" id="BI16" name="medicareNumber" class="form-control" ng-model="hraFormData.HraValuesJson.BI16" />In
    </div>
    <label for="BI16" class="col-md-1 control-label">Weight:</label>
    <div class="col-md-1">
        <input type="text" id="BI16" name="medicareNumber" class="form-control" ng-model="hraFormData.HraValuesJson.BI16" />
    </div>
    <label for="BI16" class="col-md-1 control-label">BMI:</label>
    <div class="col-md-2">
        <input type="text" id="BI16" name="medicareNumber" class="form-control" ng-model="hraFormData.HraValuesJson.BI16" />Lbs
    </div>
    <label for="BI16" class="col-md-1 control-label">Waist:</label>
    <div class="col-md-2">
        <input type="text" id="BI16" name="medicareNumber" class="form-control" ng-model="hraFormData.HraValuesJson.BI16" />
    </div>
</div>

Answer 1

You can use Bootstrap's input groups to attach the units to the inputs:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<div class="form-group">
  <label for="BI16" class="col-md-1 col-md-offset-1 control-label">Height:</label>
  <div class="col-md-1">
    <div class="input-group">
      <input type="text" id="BI16" name="medicareNumber" class="form-control" ng-model="hraFormData.HraValuesJson.BI16" />
      <span class="input-group-addon">In</span>
    </div>
  </div>
  <label for="BI16" class="col-md-1 control-label">Weight:</label>
  <div class="col-md-1">
    <div class="input-group">
      <input type="text" id="BI16" name="medicareNumber" class="form-control" ng-model="hraFormData.HraValuesJson.BI16" />
      <span class="input-group-addon">Lbs</span>
    </div>
  </div>
  <label for="BI16" class="col-md-1 control-label">BMI:</label>
  <div class="col-md-2">
      <input type="text" id="BI16" name="medicareNumber" class="form-control" ng-model="hraFormData.HraValuesJson.BI16" />
  </div>
  <label for="BI16" class="col-md-1 control-label">Waist:</label>
  <div class="col-md-2">
      <input type="text" id="BI16" name="medicareNumber" class="form-control" ng-model="hraFormData.HraValuesJson.BI16" />
  </div>
</div>