Dropdown menus
Dropdown component statesBasic dropdown
Default dropdown menu styling
Disabled items
Disable the link with .disabledclass
Active menu item
Make the link active with .activeclass
Dropdown headers
Dropdown header with optionsDefault header
Basic headerstyling of label sections
Header with underline
Basic headerstyling of label sections
Uppercase headers
Basic headerstyling of label sections
Highlighted header
Highlight header using .dropdown-header-highlightclass
Heading elements
Basic headerstyling of label sections
Menu header icons
Display left/right positioned icons
Dropdown submenu
Multilevel submenu with optionsBasic submenu (on click)
Basic multilevel menu example
Basic submenu (on hover)
Doesn't work well on mobile devices
Dropup menu (on click)
Change verticalorientation to top
Dropup menu (on hover)
Doesn't work well on mobile devices
Left orientation (on click)
Change horizontalorientation to left
Left orientation (on hover)
Change horizontalorientation to left
Additional sizes
Dropdown sizes with elementsLarge menu size
Using .dropdown-menu-lgclass
Small menu size
Using .dropdown-menu-smclass
Mini menu size
Using .dropdown-menu-xsclass
Dropdown components
Icons, checkboxes, radios, switches etc.Left menu item icons
Dropdown icons in leftposition
Right menu item icons
Dropdown icons in rightposition
Icons and text combo
Combine text and icons for annotations
Dropdown with badges
Dropdown menu items with badges
Dropdown with pill badges
Dropdown menu items with pill badges
Left positioned
Additional left side placement
Menu with checkboxes
Left and right positioned checkboxes
Menu with radios
Left and right positioned radios
Menu with switches
Left and right positioned switches
Custom menu colors
Custom background and state colorsSolid dropdown menu
Example of a soliddropdown menu
Disabled menu items
Disable menu items with disabledclass
Active menu item
Set active menu item with activeclass
Menu item icons
Left and right positioned icons
Checkboxes and radios
Checkboxes and radios in solidmenus
Labels and switches
Labels, badges and switch toggles
Border options
Optional border customizationsMenu without border
Hide border using .border-0class
Border color
Using .border-*class
Stronger border
Using .border-2class