[Webkit-unassigned] [Bug 116850] New: Viewport-relative Units (vw/vh) Don't Contribute to Containing Block Sizing

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=116850

           Summary: Viewport-relative Units (vw/vh) Don't Contribute to
                    Containing Block Sizing
           Product: WebKit
           Version: 528+ (Nightly build)
          Platform: Macintosh
        OS/Version: Mac OS X 10.8
            Status: NEW
          Keywords: InRadar
          Severity: Normal
          Priority: P2
         Component: Layout and Rendering
        AssignedTo: webkit-unassigned at lists.webkit.org
        ReportedBy: jonlee at apple.com
                CC: koivisto at iki.fi, simon.fraser at apple.com,
                    rniwa at webkit.org, webkit-bug-importer at group.apple.com,
                    joethomas at motorola.com


Created an attachment (id=203021)
 --> (https://bugs.webkit.org/attachment.cgi?id=203021&action=review)
Test case

If an element is sized using the relative units vw or vh, it does not appear to contribute to the content width of its containing block.

See the attached reproduction for an example: in a div containing a red "spacer" block sized with width: 5vw, and a string of text, the text overflows the div because the width of the spacer is not taken into account when computing the box size. The second test case shows the same example but using px instead of vw, and the box sizing behaves as expected.

STEPS TO REPRODUCE
1. Open the attached test case.
2. Also of note: watch the behavior (or lack thereof) of the red box when the browser window is resized.

Two unexpected things happen: the text overflows the box, even though it and all of its contents are display: inline-block; and, the red box does not resize when the viewport size changes without a refresh.

As shown in the third test case (and the first, to some degree), it appears that viewport-relative-sized blocks do contribute to the content *height* of an element, it's just the width that does not get resized.

<rdar://problem/13967661>

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.