Bug 143305 - Viewport relative vh unit needs to update values based upon dynamic tab/address chrome
Summary: Viewport relative vh unit needs to update values based upon dynamic tab/addre...
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: 528+ (Nightly build)
Hardware: iPhone / iPad iOS 8.2
: P2 Normal
Assignee: Nobody
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2015-04-01 06:57 PDT by Ben Frain
Modified: 2022-07-19 07:09 PDT (History)
3 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Ben Frain 2015-04-01 06:57:56 PDT
The vh unit specifies one proportion of the viewport height. Therefore 100vh should be the entire viewport height. A problem occurs in Safari due to the dynamic tab/address bar that resizes on scroll (and consequently means the viewport height changes). In previous implementations of iOS the minimal-ui meta tag allowed a consistent viewport but the current version (8.2 at time of filing) has deprecated this tag.

This problem manifests when scrolling panels are created by creating container divs with a viewport height of 100vh. The scrolling panels don't get the vh value updated when the address bar chrome resizes leading to a double-scroll scenario.

You can see this issue here: http://benfrain.com/playground/scroll-test.html

In the absence of an implementation that facilitates this, is there any chance of getting some form of meta tag that prevents the address bar chrome resizing?
Comment 1 Sam Sneddon [:gsnedders] 2022-07-19 07:09:10 PDT
I think practically this has been entirely solved with the new viewport units in Level 4 (dvh, svh, lvh, etc.)?