Form controls automatically receive some global styling with Bootstrap:
All textual <input>
, <textarea>
, and
<select>
elements
with class .form-control
have a width of 100%.
In Bootstrap, there are three types of form layouts:
There are three standard rules for these 3 form layouts:
In an inline form, all of the elements are inline, left-aligned, and the labels are alongside.
A horizontal form means that the labels are aligned next to the input field (horizontal) on large and medium screens. On small screens (767px and below), it will transform to a vertical form (labels are placed on top of each input).
Additional rules for a horizontal form:
.form-horizontal
to the <form>
element.control-label
to all <label>
elements