Change Order Selection on smaller screen size

Need help Responsiveness
1

Hi there,

I have a Row container with two Column Containers.

[ [ 1 ] [ 2] ]

When the page is smaller than 768, I’d like to switch the Order to be

[ [2] [ 1 ] ]

Is this possible? I’ve tried different conditions and do not see the option.

I appreciate any help you can provide.

Edwin

1 Like
2

You might have to create 2 different groups where their conditionally visible

3

I’m also interested in this. I’ve already have 2 different groups but it still doesn’t seem to work when adding a cndition on whether the element is visible or not.

4

Ok. I assumed this was the case and was hoping for that condition to be included!

5

Wondering if there is still no solution to this?

This was a conditional feature in Bubble until it switched to Flexbox.

Has anyone figured out how to solve this issue without adding an additional hidden element?

Open to use of code.

Thanks in advance.

6

To change the column order on mobile without any hidden elements, it will be sufficient if you add the following custom CSS to the page:

#changeOrder { 
    flex-wrap: wrap-reverse;
}

Then, add the ID “changeOrder” to the parent container (the one that holds the containers whose order should be switched).

1 Like