Dropdowns can be triggered from anchor or button elements. Wrap the dropdown’s toggle (your button or link) and the dropdown menu within
Trigger dropdown menus above elements by adding
.dropright to the parent element.
By default, a dropdown menu is automatically positioned 100% from the top and along the left side of its parent. Add
.dropdown-menu-right to a
.dropdown-menu to right align the dropdown menu.
Button dropdowns work with buttons of all sizes, including default and split dropdown buttons.
Use animation classes from animate.css to quickly change the appearance of a dropdown. e.g.
Create menu items with button or anchor tags. You can also add non-interactive dropdown items or add a header to label sections or separate groups with a divider.
Place any freeform text within a dropdown menu with text and use spacing utilities or simply use
Add an icon using i tag within
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.
.dropdown-menu-dark modifier class to change the dropdown look to a dark one.