Dropdown

Basic

The dropdown’s trigger and the dropdown menu must be wrapped within .dropdown, or another element that declares position: relative;.

Right-aligned

To create a right-aligned dropdown menu, add the .dropdown-menu-right class to the .dropdown-menu.


<div class="dropdown-menu dropdown-menu-right">
  ...
</div>
        

Active

Header

Divider

Disabled

With label

A dropdown menu item can contain a label, just place the .label within the dropdown menu item.

Multi-level

Multi-column

Use the .col-sm-*, .col-md-* and .col-lg-* classes to specify breakpoints.

Usage

To use dropdowns, you need to require the dropdown plugin:


require(['px-bootstrap/dropdown']);
        

Usage

To use dropdowns, you need to include ui-bootstrap.js script:


<script src="path/to/js/ui-bootstrap.js"></script>
        

Example