Feature: md-icon should be centered inside button[md-icon-button] when it's size is reduced.

Bug, feature request, or proposal:

Feature

What is the expected behavior?

<md-icon></md-icon> should be centered inside <button md-icon-button></button> when it's size is reduced.

What is the current behavior?

<md-icon></md-icon> isn't centered inside <button md-icon-button></button> when the font-size is modified.

What are the steps to reproduce?

template

<button md-icon-button>
    <md-icon>remove</md-icon>
</button>

css

md-icon {
  font-size: 16px;
}

css workaround

md-icon {
  margin-top: 6px;
  font-size: 16px;
}

pic

What is the use-case or motivation for changing an existing behavior?

Inside other element, icons aren't aligned with the text because of this behavior

Which versions of Angular, Material, OS, browsers are affected?

ng-cli beta.16 generated project
angular material alpha9-3

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}