### Input Groups

### Basic Example

Use any icon in input group from Lineawesome , Fontawesome or , Fontawesome or Metronic icons.
Left Addon
@
Some help content goes here
Right Addon
@example.com
Joint Addons
$ 0.00
Left & Right Addons
#
px
Solid Style
Amount:
Some help content goes here
Square Style
%
Some help content goes here
Air Style
+
Some help content goes here
Pill Style
#
%
Some help content goes here

### Icon Groups

Easily extend form controls by adding text, buttons, icons, or button groups on either side of textual.
Left Addon
Some help content goes here
Right Addon
Joint Addons
USD
Both Addons
Solid Style
Square Style
Air Style
Pill Style

### Sizing

Add the relative form sizing classes to the `.input-group` itself and contents within will automatically resize.
Large Input Group
Some help content goes here
Large Input Group
0.00
Small Input Group
Small Input Group

### Icon Input Groups

Use any icon in input group from Lineawesome , Fontawesome or , Fontawesome or Metronic icons.
Left Icon
Right Icon
Both Icons
Solid Style Input
Pill Style Input
Pill & Air Style Input
Square Style Input
Large Input
Small Input

### Checkboxes and Radio addons

Place any checkbox or radio option within an input group’s addon instead of text.
Left Checkbox Addon
$
Right Checkbox Addon
$
Right & Left Checkbox Addon
Left Radio Addon
$
Right Radio Addon
$
Right & Left Radio Addon

### Button Addons

Buttons in input groups must wrapped in a `.input-group-prepend` or `.input-group-append` for proper alignment and sizing. This is required due to default browser styles that cannot be overridden.
Left Addon Button
Right Addon Button
Left & Right Addon Button
Left Addon Button
Right Addon Button
Left & Right Addon Button

### Buttons With Dropdowns

The example form below demonstrates common HTML form elements that receive updated styles from Bootstrap with additional classes.
Left Button Dropdown
Right Button Dropdown
Left & Right Button Dropdown