Does anyone know if this kind of thing is possible?
I've tried using inline-group and form-inline but then it doesn't seem to conform to fit the full grid width.
Whereas form-horizontal seems to expect the entire form on one row.
This code creates the desired output (two form controls on one row) but form-groups are required around each one for viewing in sm mode.
NB: This is for a 16 col grid.
<form>
<div className="form-group row">
<!--form group needed here -->
<label className="col-form-label col-md-2" htmlFor="formGroupExampleInput">First Name*</label>
<div className="col-md-5">
<input type="text" className="form-control" id="formGroupExampleInput" placeholder="Example input" />
</div>
<!--form group needed here -->
<label className="offset-md-2 col-form-label col-md-2" htmlFor="formGroupExampleInput">Last Name*</label>
<div className="col-md-5">
<input type="text" className="form-control" id="formGroupExampleInput" placeholder="Example input" />
</div>
</div>
</form>
I don't think this is a duplicate of: Bootstrap 3: How to get two form inputs on one line and other inputs on individual lines?
...because this isn't leaving me with full control of grid columns within via form labels etc.