Align Labels and Textboxes in Form-Inline - html

Question

I am using bootstrap's grid system and want to create an inline form.
Here is what I have:
<div class="container body-content">
<form class="well form-inline" style="width: 100%;">
<div class="row">
<div class="form-group col-md-4">
<label>Location:</label>
<input type="text" class="form-control">
</div>
<div class="form-group col-md-4">
<label>Assignment:</label>
<input type="text" class="form-control">
</div>
<div class="form-group col-md-4">
<label>Incident Number:</label>
<input type="text" class="form-control">
</div>
</div>
<br>
<br>
<div class="row">
<div class="form-group col-md-4">
<label>Date:</label>
<input type="text" class="form-control">
</div>
<div class="form-group col-md-4">
<label>Training:</label>
<input type="text" class="form-control">
</div>
<div class="form-group col-md-4">
<label>Example:</label>
<input type="text" class="form-control">
</div>
</div>
</form>
</div>
When this is ran, there is no structure or alignment for the textboxes or the labels. How can I achieve this?
Here is a bootply

Answer 1

For each label and input you should make this structure:
<div class="form-group col-md-4">
<label class="col-lg-4 control-label">Location:</label>
<div class="col-lg-8">
<input type="text" class="form-control">
</div>
</div>
this will make it work with the grid system
See bootply