# Input Groups

Join text, buttons together with inputs or event several inputs as a single block.

## Examples

### Basic

<script async src="//jsfiddle.net/stuartaccent/864dysra/embed/html,result/"></script>

### With Buttons 

<script async src="//jsfiddle.net/stuartaccent/k91rf7uq/embed/html,result/"></script>

### Multiple Inputs

<script async src="//jsfiddle.net/stuartaccent/wkyfr5nj/embed/html,result/"></script>

### Icon Inputs

<script async src="//jsfiddle.net/stuartaccent/az3bcd9f/embed/html,result/"></script>

## Variables

Below are the default variables, adjust any of these before you import the component.

```scss
$input-group-addon-padding-x:   $input-padding-x !default;
$input-group-margin-bottom:     $input-margin-bottom !default;
```