mat-icon height/width styles not specific enough

[raciasolvo]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

Icon should be 24px.

What is the current behavior?

What are the steps to reproduce?

https://stackblitz.com/edit/angular-htjtlq

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

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

Last

Is there anything else we should know?

When sprites don't have width and height (see https://raw.githubusercontent.com/google/material-design-icons/master/sprites/svg-sprite/svg-sprite-action-symbol.svg) we can see the bug. Weight of your style is less.

I wrote early #3441

In some projects I also use flex-shrink instead width and height for svg:

@mixin mat-icon-size-bug() {
  	.mat-icon {
  		flex-shrink: 0;
	}
}

[tomwanzek]

Experiencing the same issue with svg icons being clipped in width.

[jelbourn]

It looks like the component styles are being overridden by more-specific browser agent styles

[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.}