I’ve been using Foundation 6 for a project (actually, Webflow made me understand CSS so much better that projects with hand coding are easier) and realized they use flexbox for their grid system.
Webflow really needs a “push” and “pull” to reorder grids. It’s really important, but so far has not been implemented. Since flexbox natively supports reordering, a flexbox grid can easily tackle this without any hacks or complexity. I suggest taking a look at this.
Perhaps this isn’t what you mean, but there is an option to “Reverse Layout”.
I’ve used this for desktop vs. mobile.
So on desktop it’s LEFT and RIGHT div’s… then on mobile, I reverse it, so that the “right” div is on top, viewable first…
Take a look at this site:
and they even have a game to help you understand how flexbox works:
I figured we had to use flex box to create the grid system ourself so it still takes some extra work. I might be incorrect so I’ll look at the docs again.
With Foundation you can actually number the order of the grids, so reverse is not the only option, but changing the order to any combination.
This might help: