How to stick a floating group to another page element? – Responsiveness


I have 2 groups on the page

  1. Floating group filter (on the left)
  2. Repeating group with all products, endless scroll (on the right)

How do I make #1 stick to #2?

Have tried playing with the margins, but it doesn’t keep responsive well on screen size change.

What do you mean ‘make it stick’?

What are you trying to do?

Maybe alighn to the the FG to the right G is a better description of the problem.

In that case, just set the left margin of the main group to the same width as the FG.

So i shuld make the FG fix width?

Well that depends if you want it to be fixed width or not (what’s your intended responsive behaviour?)…

But, generally, yeah… I’d make a side bar fixed width in most cases (unless of course that’s not how you want it).

Doesn’t seems to work…
the FG keeps aligned the the left, and there is a gap between the main and the FG

Well you obviously haven’t set the margins or layouts correctly for what you’re trying to achieve.

This should be simple… so make sure you’re familiar with how responsive layouts work in Bubble, then you should have no problem doing this.

But feel free to share you current layout settings if you’re stuck.

You’re probably correct on that.
I’m a beginner and trying to fix an app that a freelancer made for me.

What layout settings will help you help me please?

It will be the combined settings of your page, and all the containers within it, including the settings of the RG and main groups themselves…

So you need to understand how it wall works together.

But primarily, the FG and the ‘main’ (top level) container group of your page should be the ones you need to look at.

I don’t really know what I’m looking at in your screenshots (I can’t see the FG layout settings, and I don’t know what the other things are)…

But all you really need is to have the left margin of your main container the same (or slightly more than) the width of the FG sidepanel.



Source link

Leave a Comment