# Input groups
A field joined to what belongs to it - a unit, a prefix, a button, a choice - into one control. The borders meet by themselves; a menu or a hidden element inside the group is left out of the joining.
## Examples
`input-group` around a `form-control` or a `form-select` and its parts: `input-group-text` for words and icons, a `btn` for an action. An icon inside the field itself is [`form-adorn`](form.md).
```html
THB
https://
```
A plain `btn` wears the field's line and an accent face, so the group reads as one control; a plain `btn-icon` reads as `input-group-text`. A solid, outline, subtle or text button keeps its own look.
### With a choice
A `form-select` or a check joins the same way; a check goes inside an `input-group-text`.
```html
%
```
### With a floating label
A [`form-floating`](form.md#form-floating) grows in the group as a field does, and its parts take its height: an icon or a unit in `input-group-text`, a `btn` or a square `btn-icon`. A password keeps its `--reveal` button and its strength; the error goes under the group, in a `form-field`.
```html
%
```
### With a menu
The menu sits in the group beside its button; the group joins only what it shows.
```html
```
### Small, in a field
`input-group-sm` sizes every part of the group; `form-field` carries the label, the hint and the error outside it.
```html
months
Given with a yearly plan.
```
## States
## Keyboard and accessibility
- Every field of a group has its own name - a `