WS WhereIsStuff
Tutorial Guides
Log In
Sign Up

Advertisement

Google Ad Slot: content-top

Bootstarp 5 Dropdown

~1 min read · Bootstrap
On this page
❮ Previous Next ❯

Dropdowns in Bootstrap 5 are versatile and used to display a list of links or options that appear when triggered by a button, link, or other interactive element.

Basic Dropdown:

Use .dropdown with .dropdown-menu to create a basic dropdown.

Example
Try it yourself

Dropdown with Dividers:

Use .dropdown-divider to separate groups of items.

Example
Try it yourself

Dropdown with Headers:

Use .dropdown-header to add headers to the dropdown menu.

Example
Try it yourself

Dropdown with Disabled Items:

Use .disabled to disable items in the dropdown menu.

Example
Try it yourself

Alignment Options:

Align the dropdown menu to the right using .dropdown-menu-end.

Example
Try it yourself

Dropup Variation:

Change the direction of the dropdown to upward using .dropup.

Example
Try it yourself

Dropright and Dropleft:

Create dropdowns that open to the right or left using .dropright and .dropleft.

Example
Try it yourself

❮ Previous Next ❯