[Webkit-unassigned] [Bug 127771] New:=?UTF-8?Q?=20Layout=20recalculation=20makes=20viewport=20height=C2=A0equal=20to=20content=20height?=, impacting viewport-relative vh units.
bugzilla-daemon at webkit.org
bugzilla-daemon at webkit.org
Tue Jan 28 03:40:14 PST 2014
https://bugs.webkit.org/show_bug.cgi?id=127771
Summary: Layout recalculation makes viewport height equal to
content height, impacting viewport-relative vh units.
Product: WebKit
Version: 528+ (Nightly build)
Platform: iOS
URL: https://github.com/scottjehl/Device-Bugs/issues/36#iss
uecomment-33470005
OS/Version: All
Status: NEW
Severity: Major
Priority: P2
Component: New Bugs
AssignedTo: webkit-unassigned at lists.webkit.org
ReportedBy: paulo at paulozoom.com
This GitHub issue explains the issue in detail, with code examples and screenshots: https://github.com/scottjehl/Device-Bugs/issues/36#issuecomment-33470005
Short explanation:
Using vh units on Mobile Safari, such as on a 'max-height: 50vh' declaration, doesn't have the expected result. I’ve found the cause for this to be not the units themselves, but the viewport height that the units are relative too. This viewport height works as expected until any user or code-triggered event forces a layout recalculation — this can be a device orientation change or JS code such as Typekit.
When this happens, the viewport height appears to be set to the content height (I say appear because the visible area does not change). This causes viewport-relative units to have a value relative to the new viewport height, which is now the content-height, making them much much larger than intended, whereas these units are expected to work relative to the viewport height, usually the device height.
How to reproduce:
1. Use any viewport height relative value in an document element.
2. Trigger any layout-recalculating event, such as an orientation change, or some cases of JavaScript code.
3. Watch the height of said element change.
--
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.
More information about the webkit-unassigned
mailing list