Bootstrap Button Groups

Bootstrap provides some predefined classes to create group a series of buttons together in a single horizontal or vertical line.


<div class=”btn-group”>
  <button type=”button” class=”btn btn-primary”>Button 1</button>
  <button type=”button” class=”btn btn-primary”>
Button 2
</button>
  <button type=”button” class=”btn btn-primary”>Button 3</button>
</div>

Vertical Bootstrap Button Groups Bootstrap also has predefined class to create vertical button groups:

<div class=”btn-group-vertical”>
  <button type=”button” class=”btn btn-primary”>Button 1</button>
  <button type=”button” class=”btn btn-primary”>Button 2</button>
  <button type=”button” class=”btn btn-primary”> Button 3</button>
</div>

Justified Bootstrap Button Groups –
.btn-group-justified class is use to create justified button groups.

<div class=”btn-group btn-group-justified”>
<a href=”#” class=”btn btn-primary”>Button 1</a>
<a href=”#” class=”btn btn-primary”>Button 2</a>
<a href=”#” class=”btn btn-primary”>Button 3</a>
</div>


Leave a Reply

Your email address will not be published. Required fields are marked *