I’ve been playing around with my a grid element I have setup that looks really nice on Desktop and Tablet. It’s got six containers and alternates between image text, text image, and image text rows.
I’ll link to the page I’m referencing down below.
The problem I’m now trying to solve is on mobile when the grid collapses down to a single column. Due to the order of the containers in my two-column layout on Desktop and Tablet sizes, the grid collapses down to an order of image -> text -> text -> image -> image -> text.
Is it possible to control how the grid containers collapse and maybe switch to order? I’d like the mobile single column to read image text, image text, image text but I don’t think it’s possible with how I have things setup.
Maybe I need to switch to a container layout with flex-box instead and drop the grid element, although I’m afraid I’ll run into a similar issue.
Any insight here would be great.
Yes, there is an easy fix to this.
First, go to mobile view. Reference: https://docs.generateblocks.com/article/responsive-controls/
Then, set an order value to the column Containers. You can set them to 1, 2, 3, 4… respectively to arrange them in an order you want. Reference: https://docs.generateblocks.com/article/layout-options-overview/#order
Let us know how it goes.
Oh my gosh perfect! This is exactly what I needed. Thanks Fernando!
You’re welcome, Adamugo!
- You must be logged in to reply to this topic.