Forum Documentation Showcase Pricing Learn more

Page/Group height should adjust to screen height

This should be a thing. How is it that web apps and mobile apps do this but it doesnt work with Bubble?

You can make your Bubble apps do this, but you’ll need some CSS or JavaScript adjustments to do so. It’s possible, just not out of the box.

Thank you for your response. Is this a simple line of code or is it more complex? Would it work for pages or would it also work for groups? (I have a mobile app that uses groups instead of multiple pages)

You may find this post useful https://forum.bubble.is/t/adjusting-page-height/40252

1 Like

I clicked your link but it directs me to a page that says I’m not allowed to have access to that topic. :frowning:

Apologies, i shared a link to a PM thread in error. So, someone asked me about this and found my answer below helpful.

“… the trick is to stack the groups on top of each other. There must be no overlap. To be clear, stack on top of each other means that if the first group has a Y coordinate of 0 and is 200px long, the next one should have a Y coordinate of 200px and so on. You will likely end up with a very long page in the editor but if you hide and collapse the groups, your page in run time should only be the combined length of the group(s) that are visible at the time.”

1 Like

How would I make these stacked groups respond to screen size changes?

They wouldn’t. This solution is really important to do, but won’t help solve your issue. You’re looking to have things bound to all four borders of the screen, but that’s not how Bubble is setup to work.

I’d check this thread for some other options: Setting a group to be % of viewport height dynamically

2 Likes

thank you for sharing this. i think this is the solution.