Safari mobile: Sticky menu at bottom with delay

Design help General
1

This is probably an easy fix, but we just can’t get it done:

We have an issue where the sticky menu at the bottom of a website reacts with too much delay to safari moving the adress bar in and out (see this video) in mobile break points. It works just fine in chrome.

Does anyone know of a fix to that?

Much appreciated!

Thanks

Here is my site Read-Only: Webflow - VierD_Client-First

2

try to use dvh

something like this:

html, body {
    height: 100vh;  /* standard definition (as fallback) */
    height: 100dvh; /* dynamic vh will make the trick on iOS */
}

overview

details
https://www.w3.org/TR/css-values-4/#viewport-relative-units

they are supported in all major browsers

it may help

3

Thank you so much Stan! It made things even smoother in Chrome, but hardly solved the issue for Safari. I guess we’ll have to live with it.

1 Like