Forms

What you need to know here:

• The class form-control, which is a Bootstrap class that adds structure to forms. Textual form controls—like <input>s, lt;selectgt;s, and <textarea>s—are styled with the .form-control class. Included are styles for general appearance, focus state, sizing, and more.
As examples for the above:
• We can create a selection drop box (like this one for sex) using form-control.
• Sex Male Female Would rather not say

                              
                                  <div class="form-group">
                                      <label for="start">Sex</label>
                                      <select class="form-control" name="sex" id="sex">
                                          <option value="AL">Male</option>
                                          <option value="AK">Female</option>
                                          <option value="AK">Would rather not say</option>
                                         </select>
                              
                          

• We can also make inputs larger or smaller using things like form-control-lg or form-control-sm
• We can choose to customize our checkboxes
• The class form-group
• To prevent individual parts of the form from stetching all the way across the page, we ...

Dreadful!

This looks pretty bad! How can we avoid this? Scroll down!

Slightly better

• While you can place two inputs on the same row using class="row", you can also choose class="form-row", which reduces the guttering and clutter between inputs. Not in Bootstrap 5, apparently!
• You should be mindful of how responsive the form is as well!
• You could start by setting out the elements you want to include on your form, and then create a form-row div class around things you want to keep on the same row! Don't forget to distribute them too! It doesn't necessarily need each of the elements to add up to 12, but it looks better if you do! Don't forget to ensure the SMALL size looks good as well - adding in something like "col-md-3" would ensure an element takes up 3/12ths of the space until the medium breakpoint, for example!