Topic: Issues with navigation bar in safari under ios26
Safari in iOS 26 has a navigation bar that shrinks while scrolling.
This lets the navigation bar interact unreliably with fullscreen modal dialogs and elements that are supposed to be fixed to the bottom of the viewport.
I found an article related to this here:https://stripearmy.medium.com/ios-26-0-be-prepared-for-viewport-changes-in-safari-e867d7eace43
Here is an imgur gallery with screenshots in case the embedded images aren't loading: https://imgur.com/a/LKR7JrE
Sticky Button while stationary:
Sticky button while scrolling:
Fullscreen modaldialog stops at transparent navbar:
Navigation bar shrinks while scrolling and you can see the website behind the fullscreen modal:
I’m sorry, could you please describe the problem in more detail and provide a code snippet? I’m not entirely sure what issue you need help with.
Maurice Grimberg pro premium priority commented 4 days ago
A modal window with the classes "modal-dialog modal-fullscreen" for example is supposed to cover the whole height of the screen.
With iOS 26 Safari there are some issues with this because:A.) The navigation bar of the safari browser "shrinks" while scrolling but the modal window stays the same size. That way a gap forms between modal window and navigation bar where you can see the site "behind" the modal window.B.) The navigation bar is transparent with liquid glass enabled. The modal window stops at the upper end of the navbar - but because the navbar itself is transparent you can also see the content of the website behind the modal window.
This is an issue with any fullscreen modal dialog with the class "modal-fullscreen".
Sorry, this is a common issue with fullscreen modals on iOS Safari. The transparent navigation bar and dock are rendered outside the standard viewport height, so 100% or 100vh does not extend into that area. As a result, the modal cannot cover the glass-effect background behind those UI elements. Unfortunately, there is no reliable workaround for this behavior — it’s a limitation of how iOS Safari handles viewport sizing and system UI overlays.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 9.2.0
- Device: iPhone
- Browser: Safari
- OS: iOS 26
- Provided sample code: No
- Provided link: Yes