Thanks Rocco,
I need to fit a 3×3 pictures grid into mobile devices in landscape orientation. Navigation arrows and other buttons are placed on a left control bar. To maximize available space I hide header, footer and nav-topbar. Then I place elements using absolute top, bottom and left positions set in vh and vw units.
In mobiles, vh disregards the url-bar height. Thus, when the page launches (visible url bar) vh returns one value and as soon as you scroll down (not visible url bar) vh returns a different value.
Since the left bar allows for navigation and exit controls, I expected to launch the page without the top url bar. But it seems this is not possible without some js or php coding which is beyond my skills.
The way out I found is to place a top banner (height=100vh) with a button that prompts the user to scroll-down (“Play ↓”) and links to a document anchor that shows the grid.
I would appreciate your comments and suggestions.
Cheers,
Dario
