Changing the layout of containers on mobile

I have Grid with two containers in it side-by-side (text and image).

On the desktop, it looks like:
[container A] [container B]

On the phone, it follows the same layout and looks like:
[container A]
[container B]

However, I want it to be,
[container B]
[container A]

I have no idea how to do this, because changing the layout changes it everywhere. I would appreciate if anyone can help me with this.

CSS Grid is a pretty powerful way of setting things up. I recommend checking out this: Grid | Webflow University

At the same time if what your doing is just two simple columns essentially, you may be better off using flexbox. Flexbox is really easy to swap the orientation and direction across breakpoints.