Files
sousa-gecko/testing/web-platform/tests/css/css-values/viewport-units-gutter-006.html
T
David Grogan 215a792567 Bug 2004088 [wpt PR 56491] - [viewport units] Subtract scrollbar gutters from the viewport size, a=testonly
Automatic update from web-platform-tests
[viewport units] Subtract scrollbar gutters from the viewport size

In addition to unconditional scrollbars, we also have to subtract any gutters from the viewport size because they also unconditionally take up space.

Gutters only take up space in the inline direction, so we have to check the resolved writing mode property now.

Bug: 354751900
Change-Id: I07f1d9cd467e3c872da65d4ea709a21b14507c10
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7226421
Commit-Queue: David Grogan <dgrogan@chromium.org>
Reviewed-by: Anders Hartvoll Ruud <andruud@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1554127}

--

wpt-commits: 57507a3357ba2ab43803e65499675e85bf3c9e28
wpt-pr: 56491
2025-12-11 08:58:15 +00:00

22 lines
1.0 KiB
HTML

<!doctype html>
<html style="overflow-y: auto; scrollbar-gutter: stable; scrollbar-width: none">
<link rel="help" href="http://www.w3.org/TR/css3-values/#viewport-relative-lengths">
<meta name="assert" content="vw is not reduced in the presence of a scrollbar gutter when scrollbar-width is 'none'">
<!-- This test uses checkLayout instead of a reference because it's unclear how elements that overlap with the gutter should be laid out and painted. See https://github.com/w3c/csswg-drafts/issues/5253 -->
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/check-layout-th.js"></script>
<body style="margin: 0; padding: 0;">
<div style="width: 100vw; height: 100px; background: orange; box-sizing: border-box; border-left: 3px solid blue; border-right: 3px solid blue;" id="test-div"></div>
<script>
let testDiv = document.getElementById('test-div');
testDiv.setAttribute("data-expected-width", window.innerWidth);
checkLayout("#test-div");
</script>
</body>
</html>