Bug 143305
| Summary: | Viewport relative vh unit needs to update values based upon dynamic tab/address chrome | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Ben Frain <contact> |
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW | ||
| Severity: | Normal | CC: | bfulgham, gsnedders, jensimmons |
| Priority: | P2 | ||
| Version: | 528+ (Nightly build) | ||
| Hardware: | iPhone / iPad | ||
| OS: | iOS 8.2 | ||
Ben Frain
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?
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Sam Sneddon [:gsnedders]
I think practically this has been entirely solved with the new viewport units in Level 4 (dvh, svh, lvh, etc.)?