Sweet Button Icon Alignment on Mobile

A small detail, but it is annoying me. When viewed in mobile/portrait format, the icon used on a Sweet Button is not centred vertically. I have tried playing with the @Media style within the browser inspector:

@media screen and (max-width: 500px)
#stacks_in_159 .button_icon, #stacks_in_159 .button_icon i {
height: 32px;
line-height: 2em;
font-size: 19px;
}

...and if I change the line-height to 32px the icon will centre, but I cannot seem to achieve this by adding the amended rule to the CSS for the page. Perhaps I am targeting or expressing it incorrectly (I have tried variations, including adding a text-align rule), so any advice from those more skilled with CSS would be welcome.

The issue does not seem to be theme related, as it also occurs on other sites with different themes and icons.

11 replies