From 097f241c6ff29fb851de6c403fde9d49e075af1c Mon Sep 17 00:00:00 2001 From: adlee-was-taken Date: Sun, 22 Feb 2026 14:26:50 -0500 Subject: [PATCH] Fix Chrome Android viewport overflow with position fixed game screen Use position:fixed with inset:0 for the game screen instead of height-based sizing. This bypasses the Chrome Android 100vh bug where vh includes space behind the dynamic URL bar. Also adds -webkit-fill-available fallback on body. Co-Authored-By: Claude Opus 4.6 --- client/style.css | 17 +++++++---------- 1 file changed, 7 insertions(+), 10 deletions(-) diff --git a/client/style.css b/client/style.css index aa362b0..95cdfb2 100644 --- a/client/style.css +++ b/client/style.css @@ -4907,6 +4907,7 @@ body.screen-shake { body.mobile-portrait { height: 100vh; + height: -webkit-fill-available; height: 100dvh; overflow: hidden; overscroll-behavior: contain; @@ -4915,23 +4916,19 @@ body.mobile-portrait { body.mobile-portrait #app { padding: 0; - height: 100vh; - height: 100dvh; - max-height: 100vh; - max-height: 100dvh; + height: 100%; overflow: hidden; } /* --- Mobile: Game screen fills viewport --- */ /* IMPORTANT: Must include .active to avoid overriding .screen { display: none } */ body.mobile-portrait #game-screen.active { - height: 100vh; - height: 100dvh; - max-height: 100vh; - max-height: 100dvh; + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; overflow: hidden; - margin-left: 0; - width: 100%; display: flex; flex-direction: column; }