Google Ad Slot: content-top

Bootstrap 5 Button Group

~1 min read · Bootstrap

On this page

Bootstrap 5 provides a button group component, which allows you to group a series of buttons together on a single line for compact user interfaces.

btn-group: Wraps the group of buttons.
btn: Styles the buttons within the group.

Example

Try it yourself

Vertical Button Group:

To stack buttons vertically, use the btn-group-vertical class:

Example

Try it yourself

Sizing Button Groups:

You can create small or large button groups by adding .btn-group-sm or .btn-group-lg.

Example

Try it yourself

Justified Button Groups:

To make buttons stretch to fill the width of their parent, use utilities like d-flex and w-100.

Example

Try it yourself

Disabled Buttons in Groups:

You can disable buttons individually in a group by adding the disabled attribute.

Example

Try it yourself

❮ Previous Next ❯

Formatter

Design

Editor

Generator

Converter

Tester

Search

Welcome Back

Create Account

Forgot Password

Bootstrap 5 Button Group

Vertical Button Group:

Sizing Button Groups:

Justified Button Groups:

Disabled Buttons in Groups:

Cookie Consent & Privacy Preferences