wpt / css / css-multicol / scroll-width-height.tentative.html

Status: FAIL | Duration: 1ms | Subtests: 2/6 | Open test on wpt.live | wpt.fyi

TestTest SourceSubtests (2/6)

Data from commit:
708eb61 WPT runner: support mismatch reftests and multiple rel=match links (#665) (2026-08-09)

SubtestStatusMessage
.child, .grandchild 1PASS
.child, .grandchild 2PASS
.child, .grandchild 3FAILassert_equals: data-expected-scroll-width expected 300 got 100 assert_equals: data-expected-scroll-height expected 100 got 300 assert_equals: data-expected-scroll-width expected 300 got 100 assert_equals: data-expected-scroll-height expected 100 got 300
.child, .grandchild 4FAILassert_equals: data-expected-scroll-width expected 300 got 100 assert_equals: data-expected-scroll-height expected 100 got 300
.child, .grandchild 5FAILassert_equals: data-expected-scroll-width expected 300 got 100 assert_equals: data-expected-scroll-height expected 100 got 300 assert_equals: data-expected-scroll-width expected 300 got 100 assert_equals: data-expected-scroll-height expected 100 got 300
.child, .grandchild 6FAILassert_equals: data-expected-scroll-width expected 300 got 100 assert_equals: data-expected-scroll-height expected 100 got 300

/css/css-multicol/scroll-width-height.tentative.html

<!DOCTYPE html>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/check-layout-th.js"></script>
<style>
.multi {
  width: 400px;
  height: 400px;
  columns: 3;
}
.child {
  inline-size: 100px;
  block-size: 100px;
  outline: solid black;
}
.grandchild {
  inline-size: 100px;
  block-size: 300px;
  background: lime;
}
</style>
<body onload="checkLayout('.child, .grandchild')">
<div id=log></div>

<div class="multi" style="writing-mode: horizontal-tb">
  <div class="child" data-expected-scroll-width="100" data-expected-scroll-height="300">
    <div class="grandchild" data-expected-scroll-width="100" data-expected-scroll-height="300"></div>
  </div>
</div>
<div class="multi" style="writing-mode: vertical-rl">
  <div class="child" data-expected-scroll-width="300" data-expected-scroll-height="100">
    <div class="grandchild" data-expected-scroll-width="300" data-expected-scroll-height="100"></div>
  </div>
</div>
<div class="multi" style="writing-mode: vertical-lr">
  <div class="child" data-expected-scroll-width="300" data-expected-scroll-height="100">
    <div class="grandchild" data-expected-scroll-width="300" data-expected-scroll-height="100"></div>
  </div>
</div>