Symbolset and Bootstrap 3 Buttons

I've been using both Bootstrap 3 and Symbolset icons on a project, and I noticed the when using the icons inside buttons there are two issues:

  1. The icons look too big
  2. They are not aligned vertically

I wrote some very simple LESS code which I think makes them look much better.


Before and after: Symbolset icons inside Bootstrap buttons


.btn {
    .ss-icon {font-size:  @font-size-base - 2; vertical-align: middle;}
    &.btn-xs .ss-icon {font-size:  @font-size-small - 3;}
    &.btn-sm .ss-icon {font-size:  @font-size-small - 2;}
    &.btn-lg .ss-icon {font-size:  @font-size-large - 2;}