Dropdown
Dropdown
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.
Right Menu alignment
By default,a dropdown menu is automatically positioned 100% from the top and along the left side of its parent. Add .droprightto .dropdownto right align the dropdown menu.
Dropup variation
Trigger dropdown menus above elements by adding .dropupto the parent element.
Basic Animated Dropdown
Adding animated effect to dropdown by using .dropdown-animatedalong with .dropdown.
Scale Right Animated Dropdown
Add .scale-rightto .dropdownwith .dropdown-animatedto make dropdown scale from left.
Scale Left Animated Dropdown
Add .scale-leftto .dropdownwith .dropdown-animatedto make dropdown scale from right.
Dropdown Menu
Menu Header
Add a header to label sections of actions in any dropdown menu.
Menu dividers
Add a header to label sections of actions in any dropdown menu.
Disabled Menu Items
Add .disabledto a <a>in the dropdown to disable the link.
Actived Menu Items
Add .activeto a <a>in the dropdown to active the link.
Icons Menu Items
Menu Items Badges
Grid Menu Items
Add .dropdown-grid& .col-*to .dropdown-menuto make menu in grid style.
2 Column Grid
Applied .col-2to .dropdown-gridto resize grid to 2 column.
4 Column Grid
Applied .col-4to .dropdown-gridto resize grid to 4 column.