wpt / css / css-sizing / stretch / grid-item-height-001.html

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

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

SubtestStatusMessage
[data-expected-height] 1PASS
[data-expected-height] 2PASS

/css/css-sizing/stretch/grid-item-height-001.html

<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#stretch-fit-sizing">
<script src='/resources/testharness.js'></script>
<script src='/resources/testharnessreport.js'></script>
<script src="/resources/check-layout-th.js"></script>
<meta name="assert" content="Checks the behaviour of height: stretch on grid items.">
<style>
.content {
  width: 20px;
  height: 20px;
  background: lime;
}
</style>
<body onload="checkLayout('[data-expected-height]')">

<!-- Grid item with stretch in an indefinite-height grid with definite row tracks.
     The grid area provides a definite height even though the grid container doesn't. -->
<div style="display: grid; grid-template-rows: 80px;">
  <div data-expected-height=80 style="height: stretch;">
    <div class=content></div>
  </div>
</div>

<!-- Grid item with stretch in an indefinite-height grid with auto row tracks.
     The grid area height is indefinite, so stretch falls back to auto. -->
<div style="display: grid;">
  <div data-expected-height=20 style="height: stretch;">
    <div class=content></div>
  </div>
</div>
</body>