#### Dropdowns

#### Examples

Toggle contextual overlays for displaying lists of links and more with the Bootstrap dropdown plugin.

##### Single button dropdowns

Any single `.btn` can be turned into a dropdown toggle with some markup changes. Here’s how you can put them to work with either `<button>` elements:

Dropdown link

##### Variant

The best part is you can do this with any button variant, too:

##### Dropend variation

Trigger dropdown menus at the right of the elements by adding `.dropend` to the parent element.

##### Dropup variation

Trigger dropdown menus above elements by adding `.dropup` to the parent element.

##### Active Item

Add `.active` to item in the dropdown to style them as active.

##### Headers

Add a header to label sections of actions in any dropdown menu.

##### Forms

Put a form within a dropdown menu, or make it into a dropdown menu, and use margin or padding utilities to give it the negative space you require.

##### Split button dropdowns

Similarly, create split button dropdowns with virtually the same markup as single button dropdowns, but with the addition of `.dropdown-toggle-split` for proper spacing around the dropdown caret.

##### Sizing

Button dropdowns work with buttons of all sizes, including default and split dropdown buttons.

##### Dropstart variation

Trigger dropdown menus at the right of the elements by adding `.dropstart` to the parent element.

##### Menu alignment

Add `.dropdown-menu-end` to a `.dropdown-menu` to right align the dropdown menu.

##### Disabled Item

Add `.disabled` to items in the dropdown to style them as disabled.

##### Text

Place any freeform text within a dropdown menu with text and use spacing utilities. Note that you’ll likely need additional sizing styles to constrain the menu width.