twitter/bootstrap — pull request #4409 by tobz (2012-08-15 13:47:40+00:00)
Title: Adjustment of position of icons.

I noticed that icons never seem to hit the center line of text when placed inline. Specifically, I observed this not only on the official Twitter Bootstrap landing page (in the section when the icons are placed next to their class designation) but in my own site where the buttons are placed before the text in buttons. This was observed in Chrome 21, Firefox 10/14, and IE8. My personal site is using Bootstrap 2.0.4.

The problem was obviously already looked at because there were overrides for when icons were placed under buttons marked .btn-large or .btn-small. However, there seemed to be a constant error of the margin being 1px too high across the board.

I added 1px more of top margin to icons... thus, it ends up looking like:

.icon-* -> margin-top: 1px
.btn-large .icon-* -> margin-top: 2px
.btn-small .icon-* -> margin-top: 0