Summary: | vw units not calculated properly when scrollbars are present and overflow is not auto | ||||||
---|---|---|---|---|---|---|---|
Product: | WebKit | Reporter: | Patrick Arlt <patrick.arlt> | ||||
Component: | Scrolling | Assignee: | Nobody <webkit-unassigned> | ||||
Status: | NEW --- | ||||||
Severity: | Normal | CC: | bjonesbe, karan, simon.fraser, tamlyn, webkit-bug-importer | ||||
Priority: | P2 | Keywords: | InRadar | ||||
Version: | 528+ (Nightly build) | ||||||
Hardware: | Unspecified | ||||||
OS: | Unspecified | ||||||
Attachments: |
|
Description
Patrick Arlt
2014-05-25 18:15:17 PDT
Created attachment 232047 [details]
Reproduction case
Looking at the spec, I don't come to the same conclusion that you do. The spec says that scrollbars are assumed not to exist if overflow is set to "auto". However, in your example, you have set overflow to "scroll". So I don't understand why you would expect the scrollbars to be ignored in your example. Scrollbars are supposed to *not* be ignored when overflow is set to scroll. Currently, they're ignored no matter what overflow's set to, which is in defiance of the viewport units' spec. By way of example, assume a viewport 200px wide by 100px tall. If the root element is set to "overflow: auto;", 100vw should be 200px, and 100vh 100px. This is because the scrollbars should be ignored, regardless of whether they're present. For this case all browsers are doing the right thing. Here's what that looks like, in crude ascii form: +------------------+ | | | viewport | | 200x100 | | | | | +------------------+ Now set "overflow: scroll;". Let's say our scrollbars are 20px wide. So if scrollbars are visible, the browser's viewport is now 20px less in whichever dimension has a scrollbar. If its in both dimensions, our layout is now as such: +----------------+-+ | viewport | | | 180x80 | | | | | +----------------+ | | scrollbars | +------------------+ Currently, Webkit reports the viewport as *still* being 200x100. Which makes viewport units close to useless when scrollbars are present: 100 units no longer equals 100% of the viewport, but some amount more. The spec is very clear about this being incorrect behavior. It states, "The viewport-percentage lengths are relative to the size of the initial containing block."[1] and only a couple sentences later says, "Note that the initial containing block’s size is affected by the presence of scrollbars on the viewport." Right now the initial containing block's (the document's root element in this case) size is *not* being affected by the presence of scrollbars on the viewport, like the spec states it should be. [1] http://dev.w3.org/csswg/css-values/#viewport-relative-lengths (In reply to comment #2) > Looking at the spec, I don't come to the same conclusion that you do. See this discussion from the CSS Working Group for clarification: http://lists.w3.org/Archives/Public/www-style/2013Jan/0616.html > viewport units in case of 'overflow:auto' are sized as if scrollbar is *not* present (even if they are) > In case of 'overflow: scroll', scrollbars are accounted for in calculating viewport units |