Simple Button

Link Button

Bootstrap Bootstrap Bootstrap Bootstrap Bootstrap Bootstrap Bootstrap

Input Button

Submit Button

Outline Button

Add .btn-circle to use circle buttons.

Add .btn-circle and .btn-outline to use outline circle buttons.

Add .btn-outline to use outline buttons.

Full Width button
Add .btn-block to use block button
Buttons Groups

Wrap a series of buttons with .btn in .btn-group.

Disabled Buttons

Add the disabled attribute to <button> buttons.

Button Groups toolbar & Dropdown

Combine sets of <div class="btn-group"> into a <div class="btn-toolbar"> for more complex components.


Place a .btn-group within another .btn-group when you want dropdown menus mixed with a series of buttons.

Buttons Groups

Instead of applying button sizing classes to every button in a group, just add .btn-group-* to the .btn-group.

Split button dropdowns

Similarly, create split button dropdowns with the same markup changes, only with a separate button.

Buttons With Icon

Justified Button groups

With <a> elements

Just wrap a series of .btns in .btn-group.btn-group-justified.

With <button> elements

To use justified button groups with <button> elements, you must wrap each button in a button group. Most browsers don't properly apply our CSS for justification to <button> elements, but since we support button dropdowns, we can workaround that.