Container Width vs. Page Width

I was hoping to use conditionals that access the parent group’s width as opposed to the page width. It appears that this request has come up a few times in other threads:

I’m guessing there’s a workaround using JS or CSS. Does anyone have a good solution for this, or know if Bubble plans on adding it as a feature to the new responsive engine? I believe the legacy editor had a “Hide when parent width” option in the responsive tab.

1 Like

If you container width is not fixed, it will have a direct relationship with you page width, correct? If so, you don’t need to know the container width, just the page width.

Example: I want to hide my container when its width is less then 300px.

What you can do is to open your Responsive Editor and keep decreasing the width of your page untill you reach the point where your container has 299px. Check the page width at this point and use it as condition.

It helps?

1 Like

For my particular use case I have other groups on the page that can be shown or hidden. So the width of the parent container is different depending on what elements are visible, and can change irrespective of page size.

Assuming these other groups are fixed width I can add conditionals for each visibility setting. However, if these other groups are responsive, I would need to know the width of the parent container. I’m sure there are other scenarios as well.

1 Like