Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

mat-icon in buton is not vertical centering #15819

wszgrcy opened this Issue Apr 14, 2019 · 1 comment


None yet
2 participants
Copy link

wszgrcy commented Apr 14, 2019

What is the expected behavior?

the icon in Mini Fab Buttons and Fab Buttons should really align center vertically(not vertical-align:middle )

What is the current behavior?

the icon is a little below in button and the code

<button _ngcontent-c19="" mat-mini-fab="" class="mat-mini-fab mat-accent">
<span class="mat-button-wrapper"><mat-icon _ngcontent-c19="" aria-label="Example icon-button with a heart icon" class="mat-icon material-icons mat-icon-no-color" role="img" aria-hidden="true" >favorite</mat-icon></span><div class="mat-button-ripple mat-ripple mat-button-ripple-round" matripple=""></div><div class="mat-button-focus-overlay"></div></button>

mat-button-wrapper element is not 40px but 41.11px

What are the steps to reproduce?

Official Url:
see last 2 lines

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


Is there anything else we should know?


This comment has been minimized.

Copy link

andrewseguin commented Apr 19, 2019

Duplicate of #8842

@andrewseguin andrewseguin marked this as a duplicate of #8842 Apr 19, 2019

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.