Change column order on mobile

[oblaum]

hello,

on mobile i need to change the display order of the row children
children #2 first, then #1 – instead of destkop #1 then #2

in the pro version 4 i had used grid for this, is there a new way in pro version 5?
as far as i understand the extension grid will be getting outdated.

thanks
oli

ps great update btw!

[ruenel]

Hello @oblaum,

Thanks for writing in!

You can change the order by utilizing the Flexbox option “Direction” in your row settings.

You can apply responsive styling which would set “Standard” direction on larger screens and use “Reverse” on smaller screens or vice versa.

To know more about responsive styling, kindly check this out:

• https://theme.co/docs/responsive-styling

Best Regards.

[oblaum]

hello rue,

thats great. but at the moment it seems only to work horizontally.

i have set up a test here: https://amanox-dev.oblaum.com/de/
where on mobile and XL screens the order is reversed.

on the mobile version the order is still #1 and below #2 (where it should be #2 and below #1)
– on XL the order is displayed right.

how can i display the order on mobile right?

cheers!
oli

[marc_a]

Hi @oblaum,

Yes, are you right, source order stays the same when it goes to one column. The reversing only works in the direction of the main axis (horizontally). Once it collapses to one column, that’s working on the cross axis.

Please check this video for the Layout Tricks: Reverse Column Order Responsively and for the detailed explanation.

• https://www.youtube.com/watch?v=uG8PgQ6vaAM

Hope that helps.

Thank you.