Material: Layout is broken on Safari (macOS/iOS) when using percentages inside column container

[flobiwankenobi]

Actual Behavior:

• What is the issue? On Safari the height of container with flex-5, flex-10 etc. are not correctly displayed.
• What is the expected behavior? Open up the codepen in Chrome and in Safari and you will see the issue.

CodePen (or steps to reproduce the issue): *

• https://codepen.io/1ne8ight7even/pen/vmVvGw

AngularJS Versions: *

• AngularJS Version: 1.5.9
• AngularJS Material Version: 1.1.3 (but the issue is still available in 1.1.4)

Additional Information:

• Browser Type: Safari
• Browser Version: 9+
• OS: macOS and iOS

[ThomasBurleson]

We will not fix this in AngularJS Material. You are welcome to provide a Pull Request to resolve this for Material 1.1.x.

Ongoing support for Flexbox layouts is provided in Angular 4.x with @angular/flex-layout.