Basic example of several types of form elements in one fieldset.
<div class="chi-app">
<div class="a-card">
<div class="a-card__content -p--3">
<fieldset>
<div class="a-grid -noGutter">
<div class="a-col -w--12">
<h5 class="-mb--3 -mt--0">Business Information</h5>
<div class="a-inputWrapper -floatingLabel -mb--1" id="bname">
<input class="a-input -xl" type="text" id="name">
<label for="name" class="">Business name</label>
</div>
</div>
<div class="a-col -w--12">
<div class="a-inputWrapper -floatingLabel" id="bphone">
<input class="a-input -xl" type="text" id="phone">
<label for="phone" class="">Business phone</label>
</div>
</div>
<div class="a-col -w--12">
<h6 class="-mt--2">Business address</h6>
</div>
<div class="a-col -w--12">
<div class="a-inputWrapper -floatingLabel -mb--1" id="baddress1">
<input class="a-input -xl" type="text" id="address1">
<label for="address1" class="">Address line 1</label>
</div>
</div>
<div class="a-col -w--12">
<div class="a-inputWrapper -floatingLabel -mb--1" id="baddress2">
<input class="a-input -xl" type="text" id="address2">
<label for="address2" class="">
Address line 2</label>
</div>
</div>
<div class="a-col -mr-sm--1">
<div class="a-inputWrapper -floatingLabel -mb--1 -mb-sm--0" id="bcity">
<input class="a-input -xl" type="text" id="city">
<label for="city" class="">City</label>
</div>
</div>
<div class="a-col -w-md--4 -mr-sm--1">
<div class="a-inputWrapper -floatingLabel -mb--1 -mb-sm--0" id="bstate">
<select class="a-input -xl" id="floating-label-select">
<option></option>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
<label for="floating-label-select" class="">State</label>
</div>
</div>
<div class="a-col -w-md--2">
<div class="a-inputWrapper -floatingLabel -mb--1 -mb-sm--0" id="bzip">
<input class="a-input -xl" type="text" id="zip">
<label for="zip" class="">Zip</label>
</div>
</div>
<div class="a-col -w--12">
<div class="m-formGroup -my--1 -mt-sm--2">
<input class="a-input" type="checkbox" id="checkbox1" checked="">
<label for="checkbox1"></label>
<label class="-text" for="checkbox1">This has been my business's address for more than one year</label>
</div>
</div>
<div class="a-col -w--12">
<h6 class="-mt--2">Business contact</h6>
</div>
<div class="a-col -mr-sm--1">
<div class="a-inputWrapper -floatingLabel -mb--1" id="bcname">
<input class="a-input -xl" type="text" d="contact_name">
<label for="contact_name" class="">Name</label>
</div>
</div>
<div class="a-col -w-md--6">
<div class="a-inputWrapper -floatingLabel -mb--1" id="bctitle">
<input class="a-input -xl" type="text" id="contact_title">
<label for="contact_title" class="">Title</label>
</div>
</div>
<div class="a-col -w--12">
<div class="a-inputWrapper -floatingLabel" id="bcemail">
<input class="a-input -xl" type="text" id="email">
<label for="email" class="">Email</label>
</div>
</div>
<div class="a-col -w--12">
<h6 class="-mt--2">Executive contact</h6>
</div>
<div class="a-col -w--12">
<div class="m-formGroup -mb--1">
<input class="a-input" type="checkbox" id="checkbox2" checked="">
<label for="checkbox2"></label>
<label class="-text" for="checkbox2">Same as business contact</label>
</div>
</div>
<div class="a-col -w--12">
<h6 class="-mt--2">
Additional business information
<i class="-text -text--normal">(optional)</i>
</h6>
</div>
<div class="a-col -w--12">
<div class="a-inputWrapper -floatingLabel -mb--1" id="bwebsite">
<input class="a-input -xl" type="text" id="website">
<label for="website" class="">Website</label>
</div>
</div>
<div class="a-col -mr-sm--1">
<div class="a-inputWrapper -floatingLabel -mb--1 -mb-sm--0" id="bdunns_number">
<input class="a-input -xl" type="text" id="dunns_number">
<label for="dunns_number" class="">Dunns number</label>
</div>
</div>
<div class="a-col -w-md--6">
<div class="a-inputWrapper -floatingLabel -mb--1 -mb-sm--0" id="btax_id">
<input class="a-input -xl" type="text" id="tax_id">
<label for="tax_id" class="">Tax ID</label>
</div>
</div>
</div>
</fieldset>
</div>
</div>
</div>