Angular Material 2 mat-spinner strange transformation Safari zoom level 90% or lower

I have a bug for the mat-spinner in Angular Material 2. Viewing in Safari when the browser zoom level is set to 90% or lower the spinner is off centered. B.n - the issue is worse at lower zoom levels e.g 50%.

I set the diameter to 40 but this has no impact on the issue.

<mat-spinner [diameter]="40"></mat-spinner>


It seems that the spin is not centered only in Safari whereas Chrome and other browsers don't have the same issue.

Version of Safari - Version 12.0 (14606.1.36.1.9)

See stackblitz:

https://stackblitz.com/edit/angular-material2-progress-spinner

Set the zoom level in Safari lower than 100%

NB: the spinner is also distorted at zoom levels above 100%

Continue reading...