Bootstrap 5 Button Group Example

Bootstrap 5 button group example created in horizontal and vertical style. Button group means buttons are displayed in a single line. These classes we can also use to make a group of links and input fields by using the .btn-group and .btn-group-vertical Bootstrap classes.

.btn-group class For horizontal button group
.btn-group-vertical class for vertical button group

HTML

<!-- Horizontal Button Group -->
<div class="btn-group" role="group">
    <button type="button" class="btn btn-primary">Left</button>
    <button type="button" class="btn btn-light">Middle</button>
    <button type="button" class="btn btn-warning">Right</button>
</div>


<!-- Vertical Button Group -->
<div class="btn-group-vertical btn-group-lg" role="group">
    <button type="button" class="btn btn-primary">Left</button>
    <button type="button" class="btn btn-light">Middle</button>
    <button type="button" class="btn btn-warning">Right</button>
</div>