Screen heights for Mobile?

[hegartyjonc]

A bit of a newbie question and similar to the thread found here:

Optimal screen height settings for native mobile app?

I’m building a mobile app for iOS only using Bubble/BDK and trying to figure out the optimal way to handle the screen height/scrolling issue. Currently I’m using 375x812 for the page dimensions, however, for some of my screens, the page content exceeds 812px. See below: [Screenshot 2021-05-21 at 02.31.32] I’m aware of two solutions, but I don’t think they can solve my issue: Set groups that exceed screen height to collapse (my bottom group is partially visible on load so cannot be collaps…

My question is about what screen heights to use while building for mobile. Here’s my issue:

What is the typical strategy or best practices for managing screen height when building a single-page mobile native app?

Thanks

[brian1]

With a little JS and CSS you can figure out the height of the window (the browser), and then figure out the height of the wrapper for the RG. Use the toolbox plugin to run some JS and calculate whether the height of the RG makes the height of the window taller than the window height. If it isn’t longer than the window height, fix the height of the page to 100vh. If it is, remove that class dynamically (using something like AddClass plugin), and if its shorter, add the 100vh defined class.

If you need some help doing this we could probably work something out. It’s not a huge lift.