1

I'm using @angular/flex-layout and @angular/material for my website but I'm having issues Smith my mobile layout when using safari.

This only happens when the window is small enough for the md or xs rules

On Chrome it looks like this: Chrome

But on safari it looks like this: Safari

Here is a plunk with the code where it happens: https://embed.plnkr.co/2gh075v8CZ5aU6iA0xYd/

Owain van Brakel
  • 3,109
  • 1
  • 15
  • 22

2 Answers2

2

I have found out what the issue was.

i had to add flex: 1 0 auto !important; to the parent that was not being filled correctly.

Owain van Brakel
  • 3,109
  • 1
  • 15
  • 22
-1

if you are using @angular/flex-layout try to utilize the existing fxFlex Options rather than using CSS to overwrite the styles.

same CSS flex: 1 0 auto !important can also be done by fxFlex="noshrink"

Github fxFlex-API

Karthikkumar
  • 638
  • 7
  • 10