Basic Dropdown

Wrap the dropdown’s toggle (your button or link) and the dropdown menu within .dropdown, or another element that declares position: relative;. Dropdowns can be triggered from <a> or <button> elements to better fit your potential needs.

Dropup

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

Dropright

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

Dropleft

Trigger dropdown menus at the left of the elements by adding .dropleft to the parent element.

Basic Animated Dropdown

Adding animated effect to dropdown by using .dropdown-animated along with .dropdown.

Note: Animated dropdown only applicable for .dropdown placement only. flip options will disabled in animated dropdown.

Scale Right Animated Dropdown

Add .scale-right to .dropdown with .dropdown-animated to make dropdown scale from left.

Note: Animated dropdown only applicable for .dropdown placement only. flip options will disabled in animated dropdown.

Scale Left Animated Dropdown

Add .scale-left to .dropdown with .dropdown-animated to make dropdown scale from right.

Note: Animated dropdown only applicable for .dropdown placement only. flip options will disabled in animated dropdown.

Menu Headers

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

Menu Dividers

Separate groups of related menu items with a divider.

Menu item Active

Add .active to items in the dropdown to style them as active.

Menu item Disabled

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