Flexbox switching order of divs on resize

user_9821034 0
Viewed 602

I'm looking at this demo about Flexbox in Angular, I noticed that on resize, the second-section falls below the first-section. Is there any way that I can make it lays on top of the first-section (on resize), without modifying the html?

Thank you.

angular-flex-layout flexbox angular
1 Answers

In the example above it changes because of fxLayout="row" and fxLayout.xs="column"

To custom change the ordering you will need fxFlexOrder

<div fxFlexOrder='1' fxFlexOrder.xs='3'></div>
<div fxFlexOrder='2' fxFlexOrder.xs='2'></div>
<div fxFlexOrder='3' fxFlexOrder.xs='1'></div>

fxFlex Documentation fxFlex-Responsive Documentation

user_30379270
Related