Column ordering classes allow us to change the order of the columns of our grid system. This means that on a device screen, you can have a different grid order than on a desktop screen.

For example, let's say we have 2 columns (A and B) on large screens. B will be the most prominent item (image) we have. On mobile devices, this grid will collapse to be A on top of B. We want B to take higher precedence, though, since it's our most important element.

This is what we want for mobile devices: B A. How can we achieve this?

You just need to open the Row settings, navigate to the tab Responsive, and activate the Inverted Device Order option.

Important. Please note that this method will invert the order of the first and last columns inside the row and can be used only when you have 2 columns and you have these 2 columns stacked on device view.