100dvh bug on mobile

I’ve run into this issue on several sites I’ve built, and even major sites like apple.com seem to be affected. In the attached video (from a professional studio), you can see that when I scroll down and the address bar collapses, the fixed header and footer shift, the header even disappears. This occurs in both Chrome and Safari, though it seems to work correctly in Firefox. It feels like a very common problem, yet there isn’t much information out there about it. Is there a reliable workaround? Why hasn’t it been fixed yet?
2 Replies
Kevin Powell
Kevin Powell2mo ago
Could be worth seeing if any bug reports have been filed for those if it's working different in one browser. I can't say I've seen it act like that, where content is vanishing though. Looking at Chromium, there are a lot of issues with it 😄 https://issues.chromium.org/issues?q=dvh If you see one, or some, that are the same as what you're experiencing, you can "+1" them, and even better, leave a comment. Bugs only get fixed when browsers know about them, and they have limited resources (the browser teams are quite small, even if mega corps own them), so they need to triage based on how important they are
klas
klasOP2mo ago
Thank you, I’ll go through the bug reports! Definitely reassuring to see others running into the same issue, feels good to know I’m not alone 😊

Did you find this page helpful?