Angular Material and the Safari Browser

At the time of the question, there were indeed problems with Angular Material in Safari:

• layout (mostly flex-related issues)
• dialogs (positions calculated wrongly / dialogs collapsed)
• performance (some of the fancy animations, including ripple, scale from click coords, etc)

You were using Angular Material at version < v0.10.1, which in fact had a lot of problems in general. However, nowadays (and in fact after Angular Material v1.x), those problems are gone (not only in Safari).

Angular Material became more stable and more performant (proof of this are the 7000+ closed issues). Flexbox is also better supported nowadays, which was the cause of many layout issues for versions < 1.x.

For anybody finding the question today that is running Angular Material < v1.x, the answer is simple: upgrade Angular Material to a newer version, preferably v1.1+.

I am using angular material https://material.angular.io in package.json version is "@angular/material": "2.0.0-beta.12" and its work fine in crome browser but style/layout/font are break in safari browser V 5.1.7(7534.57.2).here is screenshots of some sample control