Components: md-icon-button in md-toolbar has icon displaced

[Lavan]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

The icon should be centered in the button.

What is the current behavior?

The icon is displaced 8px upwards to be very close to outer edge of the button.

What are the steps to reproduce?

http://plnkr.co/edit/ljTlfhIkQeksCEGimtXM?p=preview

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

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

Angular 2.0.0-rc.5, angular2-material-alpha.7-4
Replicated on Windows 10 using Chrome, Firefox, Edge and IE 11.

Is there anything else we should know?

Changing the CSS style line-height from 24px to 40px (to correspond with the width and height of the button) seems to solve the issue.

[DzmitryShylovich]

I think the proper solution would be to add the following here

.md-button-wrapper {
    min-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

I can send a pr if it's fine for you @kara @jelbourn

[angular-automatic-lock-bot[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._}