Skip to content

Elements:Dropdowns

Setup

Dropdown functionality can be added to both a and button elements which have the .btn class.

Single Button


Single Link


Dropdown Mega Menus

Apply "mega menu" functionality by adding the class .dropdown-mega-menu to the parent of the .dropdown-toggle elements. You can use grid classes to layout the mega menu content.


Dropdown Effects

Add .dropdown-effect-fade , .dropdown-effect-fadeup or .dropdown-effect-fadedown to any wrapper of your .dropdown-menu elements or to a single .dropdown-menu element to apply a fade effect on opening of the dropdown.

NOTE: Effects are disabled on dropdown menus shown in the mobile menus.


Dropdown Alignment

Add .dropdown-menu-right to a .dropdown-menu to right align the dropdown menu.


Dropdown headers & dividers


Dropdown Styles


Dropdown Size


Dropdown On Hover

To make dropdown menus show on hover instead of click simply add the attribute data-hover="dropdown" to your .dropdown-toggle elements.

Awesome Features

99.9% Uptime / Free Upgrades / Fully Responsive / Bug Free
Theme Colours

Green Red Blue Purple Pink Orange Lime Blue-dark Red-dark Brown Cyan-dark Yellow Slate Olive Teal Green-bright

Cookies are NOT enabled so colour selection is not persistent.

Back to main homepage

Back to intro page