Menu
Using Bootstrap v4, how can you build a form like the one seen below?
I'm trying to understand if I should be using form-inline with either multiple form-groups or multiple rows?
https://v4-alpha.getbootstrap.com/components/forms/
388
To create a form where all of the elements are inline, left aligned and labels are alongside, add the class . form-inline to the <form> tag.
Additional rule for an inline form: Add class .form-inline to the <form> element.
Horizontal formCreate horizontal forms with the grid by adding the .row class to form groups and using the .col-*-* classes to specify the width of your labels and controls. Be sure to add .col-form-label to your <label> s as well so they're vertically centered with their associated form controls.
You'll want to use form-group and fieldset
form-group groups the input elements on the same line
fieldset makes the label appear above the input
Jsfiddle: https://jsfiddle.net/5wbeqmgc/2/
Not perfect, but a simple example using columns: https://jsfiddle.net/5wbeqmgc/4/
64
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
