Floating group behavior is messed up on iOS 26

Need help Responsiveness
1

I’m currently running iOS 26 Developer Beta, and recently noticed a significant change in floating group behavior in Safari (specific to iOS 26). The change seems to be caused by Safari’s new UI, where the address bar no longer covers content in the bottom layer.

The result of the new behavior is that floating groups are pushed down from the top and up from the bottom, making it impossible to use floating groups to create a full screen experience and cover the content behind it. On mobile, we’re using floating groups for two purposes: A full screen login page above content that should only be displayed to signed in users, and a bottom menu bar. As you can see in these screenshots, the resulting UI is absolutely disgusting.

screenshot 1
screenshot 11320×531 40.2 KB

login
login1320×544 36.8 KB

login 2
login 21320×360 27.7 KB

I’ve tried setting the min height of the login floating group to 100% to no effect. Anyone got other ideas on ways to get around this?

2

Same issue
Any solution ?

3

Not yet, and Bubble support wasn’t helpful either :confused:

4

Now iOS 26 is officially out and there is no solution

1 Like
5

@fede.bubble Hey, is this something you guys are aware of and working on?

6

We’ve tried to accommodate the new behavior as well as we can for now, mostly by removing the use of floating groups on mobile, but it’s a growing issue. Noticed other behavioral changes, most prominently that Search Box list results are now appearing above the input so you can’t see what you’re typing. Surprised there’s so little to zero attention on these issues, but if there’s one thing I’ve realized about this community using Bubble for the past 5-6 years, it’s that most Bubble-developers don’t care enough about design, particularly UX.

7

checking with the team

2 Likes
8

Hi,

I had the same issue on my apps and in case it can help I have found a temporary solution (that works on my side) by adding this html on the page :

<style>
html, body {
scrollbar-width: none;
-ms-overflow-style: none;
overflow: auto;
overscroll-behavior-y: none;
-webkit-overflow-scrolling: touch;
}
html::-webkit-scrollbar,
body::-webkit-scrollbar {
display: none;
}
</style>

Cheers!

9

Thank you thank you thank you! :folded_hands:t3:

1 Like
10

While @mossoc99 was kind enough to provide a temporary workaround, I didn’t hear back from you @fede.bubble . Is your team aware of the issue and working on a permanent fix?

11

I am also struggling with this…has anyone figured out a workaround?

edit - the html snippet is helping. still, I’m surprised that there aren’t tons of Bubblers freaking out over this. all my pages have a floating group header and footer - it ends up being crucial for the mobile experience

12

Sadly a sign that the average Bubble-developer (just was with developers in general) isn’t obsessed with UX… But yes, the snippet fixed the issue for me, and thank God for that since Bubble seems to not give a s*** despite the bug reports.

13

It looks like this snippet breaks the “scroll to an element” and “scroll to an entry in RepeatingGroup” actions. unfortunately matters a lot in my app. Anyone know what to do here?