<a href="#" class="btn {$modifiers}">Link Button</a>
<button class="btn {$modifiers}">Button Element</button>
<input type="button" class="btn {$modifiers}" value="input[type='button']"/>

1.1.kss-section.kss-depth-2

1.1Sizes

Sizing variations for buttons

Link Button

.btn-small

Small

Link Button

.btn-large

Large

Link Button

.btn-block

Make it block/full width

Link Button

<a href="#" class="btn {$modifiers}">Link Button</a>
<button class="btn {$modifiers}">Button Element</button>
<input type="button" class="btn {$modifiers}" value="input[type='button']"/>

1.2.kss-section.kss-depth-2

1.2Button Groups

Making a group of buttons joined together

Link Button Link Button Link Button

<div class="btn-group">
  <a href="#" class="btn">Link Button</a>
  <a href="#" class="btn">Link Button</a>
  <a href="#" class="btn">Link Button</a>
</div>