Just starting out with Bootstrap v4 and experimenting with it. I have a question regarding how to make an inline form expand to the full width available inside the column.
Here is the code snippet:
<div class="container">
<div class="row">
<div class="col-lg-2 title">
<h2>Make a Gift:</h2>
<p>Give Generously</p>
</div>
<div class="col-lg-10">
<form class="form-inline ">
<label class="sr-only">Donation Type</label>
<select class="form-control my-1 mr-sm-2">
<option selected>One Time Donation</option>
<option value="1">Recurring Donation</option>
</select>
<label class="sr-only">Donation Amount</label>
<input class="form-control my-1 mr-sm-2" type="number" placeholder="Donation Amount">
<label class="sr-only">Choose Fund</label>
<select class="form-control my-1 mr-sm-2">
<option selected>Syria Emergency</option>
<option value="1">Winterisation</option>
</select>
<button type="submit" class="btn btn-primary my-1">Donate Now</button>
</form>
</div>
</div>
</div>
Would greatly appreciate any tips or input from the community on where to go next.