Buttons Group
Basic
Wrap a series of buttons with .btn
in .btn-group
.
Toolbar
Combine sets of button groups into button toolbars for more complex components. Use utility classes as needed to space out groups, buttons, and more.
Nesting
Place a .btn-group
within another .btn-group
when you want dropdown menus mixed with a series of buttons.
Vertical
Make a set of buttons appear vertically stacked rather than horizontally
Sizing
Instead of applying button sizing classes to every button in a group, just add .btn-group-{sm|lg}
to each .btn-group
, including each one when nesting multiple groups.
Split button
Create split button dropdowns with virtually the same markup as single button dropdowns, but with the addition of .dropdown-toggle-split
for proper spacing around the dropdown caret.
Checkbox and radio button
Combine button-like checkbox and radio toggle buttons into a seamless looking button group.