Button Bars

Two buttons walk into a bar. Stop me if you’ve heard this one.

As you may know, Bootstrap buttons can join together into a button bar. This page demonstrates some examples of that pattern.

Notice that this page is a child of the Buttons page. You can nest patterns and pages as deeply as you see fit.

Live Demo

Standalone Demo

Markup

<div class="btn-group" role="group" aria-label="Pick a side.">
  <button type="button" class="btn btn-default">Left</button>
  <button type="button" class="btn btn-default">Middle</button>
  <button type="button" class="btn btn-default">Right</button>
</div>
<br/><br/>
<div class="btn-group btn-group-lg" role="group" aria-label="Big a bigger, more colorful side.">
  <button type="button" class="btn btn-warning">Left</button>
  <button type="button" class="btn btn-info">Middle</button>
  <button type="button" class="btn btn-success">Right</button>
</div>