I’m currently working on a project in Bubble, and I’m trying to keep a part of the page static, even when the user scrolls down. However, when I try to add another ‘Group’ element next to a ‘Floating Group,’ they overlap. From what I understand, you can’t make a ‘Floating Group’ a child of another ‘Group’ element. I think the problem is related to the layout of the page since the ‘Floating Group’ can only be a child element of the page. I set the page layout to Row and the container alignment to ‘space between,’ but the issue wasn’t resolved. I then tried other layout options on the page, but none of them solved the problem, or maybe I missed something. Can anyone help clarify or correct my approach?
I don’t know if I get to you correctly but using floating group should serve… But if you don’t want overlapping, you have to make the page layout row, then you insert the static group there and the the other part will take in other page contents…
The static half will be like a side bar sort of and will stretch vertically, don’t know if you understand my point
Hey @hcamurdan1,
Make sure to select “Above elements” in the appearance tab of your floating group.
The layout of your page shouldn’t have any influence in the way your FG is displayed
Thank you for your response
"The static half will be like a side bar sort of and will stretch vertically, don’t know if you understand my point"thats what iam trying to achieve"other part will take in other page contents…"I expected it to work like that too but instead it overlaps and what i mean overlaps is they look like they are on top of each other.
It is selected as above elements but problem still persists.I think iam missing something.Thank you for your response as well.
Could you please add a screenshot of how your page layout looks like?
Overlapping should only happen in the editor, not when previewing. Can you check please?
Is that so?I did not know that.So i should keep building my app ingoring this overlap?I thought it was a serious issue.
That’s it, you should be good to go
I still cannot wrap my head around,it should not overlap in editor if it wont overlap in preview i think.Thank you.
Does your floating group have a width or max-width defined?
To prevent group A from overlapping, you should define a left margin for it, the same size as the floating group.
Ex:
Floating group with: width ou max-width 250px
Group A with: left margin 250px