<div class="p-3">
<form action="#" method="GET">
		<div class="form-row align-items-end">
			<div class="form-group col-md">
				<label for="lastname">Last Name</label>
				<input type="text" class="form-control" id="lastname" name="lastname">
			</div>
			<div class="form-group col-md">
				<label for="firstname">First Name</label>
				<input type="text" class="form-control" id="firstname" name="firstname">
			</div>
			<div class="form-group col-md">
				<label for="middlename">Middle Name</label>
				<input type="text" class="form-control" id="middlename" name="middlename">
			</div>
			<div class="form-group col-md-2" style="">
				<button type="submit" class="btn btn-primary"><i class="fa fa-search fa-fw"></i> Search</button>
			</div>
		</div>
	</form>
</div>
Run Pen

External CSS

  1. https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css
  2. https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.min.js
  2. https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.0/axios.min.js
  3. https://code.jquery.com/jquery-3.3.1.slim.min.js
  4. https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js
  5. https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js