Why are the elements in a group moving around?

In editor:

In preview:

As you can see, for some reason the group is increasing in height and the elements inside of it are moving around. Everything is fixed width, including the group as well.

For context, the group with the border is inside of a larger group. I have similar sub groups as well, like the one pictured, and the same problem is happening to some of them but not all of them.

I have literally tried everything - any help would be much appreciated!

Hello @kamesh

Responsiveness needs to be managed.

Bubble is a blank canvas. While other tools manage responsiveness for you, in Bubble one needs to create the structure for the page’s contents.

In essence, this is a combination of grouping things and managing widths. Although this is an oversimplification … it helps to think of it this way.

For starters, consider grouping your page with a couple of groups set to fixed width and see how things behave:

To group just select the appropriate groups or elements while pressing shift and then right click and choose “group elements in a group”. Set it to fixed width and see what happens.

This is a good intro video into responsiveness > Making a Repeating Group Responsive in Bubble.is

Hope this helps! :+1:

Thanks for the response! Grouping elements into smaller subgroups fixed it, but I was just curious why for some groups it was fine and for others it wasn’t. Also, this issue just popped up randomly recently - everything looked and worked fine until recently.

In either case, I see on on the forums a lot, and I appreciate how helpful you are!

1 Like