Form Elements header small text goes here...
Inputs & Select & Textarea
Most common form control, text-based input fields. Text Inputs also includes support for all HTML5 types.
Checkboxes & Radios
Checkboxes are for selecting one or several options in a list, while radios are for selecting one option from many.
Inline Checkboxes & Radios
Checkboxes and radios without label text
Should you have no text within the
<label>, the input is positioned as you'd expect.
Currently only works on non-inline checkboxes and radios.
Set heights using classes like
.form-control-lg, and set widths using grid column classes like
Horizontal form group sizes
Quickly size labels and form controls within
.form-horizontal by adding
Bootstrap includes validation styles for error, warning, and success states on form controls.
To use, add
.has-success to the parent element.
Checkbox Validation States
Radio Button Validation States
Extend form controls by adding text or buttons before, after, or on both sides of any text-based
.input-group with an
to prepend or append elements to a single
Input Groups Sizing
Add the relative form sizing classes
.input-group-sm to the
and contents within will automatically resize
Individual form controls automatically receive some global styling.
All form elements with
.form-control are set to
width: 100%; by default.
Horizontal Form Form
Use Bootstrap's predefined grid classes to align labels and groups
of form controls in a horizontal layout by adding
to the form.
.form-inline to your form (which doesn't have to be a
for left-aligned and inline-block controls. This only applies to forms within viewports that are at least 768px wide.