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 .dropright to .dropdown to right align the dropdown menu.
Dropup variation
Trigger dropdown menus above elements by adding .dropup to the parent element.
Basic Animated Dropdown
Adding animated effect to dropdown by using .dropdown-animated along with .dropdown.
Scale Right Animated Dropdown
Add .scale-right to .dropdown with .dropdown-animated to make dropdown scale from left.
Scale Left Animated Dropdown
Add .scale-left to .dropdown with .dropdown-animated to 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 .disabled to a <a> in the dropdown to disable the link.
Actived Menu Items
Add .active to a <a> in the dropdown to active the link.
Icons Menu Items
Menu Items Badges
Grid Menu Items
Add .dropdown-grid & .col-* to .dropdown-menu to make menu in grid style.
2 Column Grid
Applied .col-2to .dropdown-grid to resize grid to 2 column.
4 Column Grid
Applied .col-4to .dropdown-grid to resize grid to 4 column.