fxLayoutAlign="center center" bug?

Bug Report

What is the expected behavior?

Expects max-width 33%

What is the current behavior?

i have the current code

<div fxLayout="row"> <!-- some code ... --> <ng-container*ngIf="someExp"> <div fxFlex="33%" fxFlex.lt-md="100%" fxLayoutAlign="center center" fxLayoutAlign.lt-md="start">

when the exp throws true, then de div flexs in a 100% when I declare it in 33% in all screen sizes

i remove fxLayoutAlign="center center" then works great, my fix was declare a css class with max-width: 33% and apliying ngClass.gt-md="w-33" class

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

Angular 9 and flex-layout 9

Is there anything else we should know?

I upgrade the angular core version from 8 to 9, in 8 that works fine, but in 9 occurs the behavior

[rannysan]

I had the same problem here, but when I removed *ngIf directive it worked fine, If you put the *ngIf in a div tag instead ng-container it will work as well.

Actually, I realized if the *ngIf is in the same tag that contains fxLayoutAlign it won’t work.

Anyone else knows if there is any workaround for this issue?

[nileshverma89]

We have the same issue, previously it was working, and once we upgraded to angular 9, flex-layout 9 we got the same issue. @rannysan solution work but we have lots of div and it’s not feasible to remove *ngIf from all of them.