Form Grid

Create two form elements that appear side by side with .row and .col:

Form Row/Grid

In this example we will demonstrate the differences between .row and .form-row.

Create two form elements that appear side by side with .row and .col:

Create two form elements that appear side by side with .form-row and .col:

Form Grid

Create two form elements that appear side by side with .row and .col:

Form Validation

In this example, we use .was-validated to indicate what's missing before submitting the form:

Form Validation

In this example, we use .needs-validation, which will add the validation effect AFTER the form has been submitting (if there's anything missing).

Try to submit this form before filling out the input fields, to see the effect.