Input Groups
Easily extend form controls by adding text, buttons, or button groups on either side of textual inputs, custom selects, and custom file inputs.
Bootstrap Input Groups DocumentationDefault
Place one add-on or button on either side of an input. You may also place one on
both sides of an input. Remember to place <label>s outside the input group.
merit has custom input group component shown below.
You can choose to combine input group elements by removing the border between them using the
.input-group-combine class.
@example.com
@
Variation
Multiple add-ons, checkboxes, radios and buttons are supported as shown in following example.
$
.00
Sizing
Add the relative form sizing classes to the .input-group itself and contents within will
automatically resize—no need for repeating the form control size classes on each element.
Small
Default
Large