Dropdown
Basic Dropdown

A dropdown menu is a toggleable menu that allows the user to choose one value from a predefined list

Dropdown Divider

The .dropdown-divider class is used to separate links inside the dropdown menu with a thin horizontal border

Dropdown Header

The .dropdown-header class is used to add headers inside the dropdown menu

Disable and Active items

The .dropdown-header class is used to add headers inside the dropdown menu

Align Right

To right-align the dropdown, add the .dropdown-menu-end class to the element with .dropdown-menu

Dropup

The .dropup class makes the dropdown menu expand upwards instead of downwards

Dropright

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

dropstart

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

  • Default
  • Green
  • Blue
  • Pink
  • Yellow
  • Orange
  • Purple
  • Red
  • Lightblue
  • Teal
  • Lime
  • Deeporange