An Input Group is a created by adding text, buttons, or button groups on either side of textual inputs, custom selects, and custom file inputs.
Use .input-group in place of .form-group to create input groups. Add class .input-group-prepend and .input-group-append to either prepend or append elements to a single .form-control respectively.
Add .pmd-input-group followed by .input-group to create Propeller customized input groups.
Use pmd-input-group-icon class to prepend or append icons with the text inputs.
Add .input-group-sm and .input-group-lg followed by .input-group for small and large input groups.
You can even perform validations to the input groups.
Checkbox and Radio button can also be added with the Inputs.
You can add multiple inputs in one input group.
You can add multiple addons before or after the text-input.
Input groups do support custom select as an input.
Input groups do support custom file as an input.
The Propeller CSS classes apply various predefined visual enhancements to the form elements. The table lists the available classes and their effects.
| Propeller Class | Effect | Remark |
|---|---|---|
.pmd-input-group |
Class added for Propeller customized input group. | Required |
.pmd-input-group-icon |
Class added for Propeller customized input group with Icons. | Required |