wpt / css / css-sizing / stretch / auto-margins-2.html

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

TestTest SourceSubtests (6/6)

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

SubtestStatusMessage
.outer>div 1PASS
.outer>div 2PASS
.outer>div 3PASS
.outer>div 4PASS
.outer>div 5PASS
.outer>div 6PASS

/css/css-sizing/stretch/auto-margins-2.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="auto margins are treated as 0 in stretched abspos boxes">

<style>
  .outer {
    width: 200px;
    height: 200px;
    position: relative;
    border: solid;
  }

  .outer>div {
    position: absolute;
    margin: auto;
    background: lime;
  }
</style>

<body onload="checkLayout('.outer>div')">

  <div class="outer">
    <div style="inset: 0; width: stretch; height: 100px;"
      data-expected-width="200" data-offset-x="0"></div>
  </div>

  <div class="outer">
    <div style="inset: 0; max-width: stretch; height: 100px;"
      data-expected-width="200" data-offset-x="0"></div>
  </div>

  <div class="outer">
    <div style="inset: 0; height: stretch; width: 100px;"
      data-expected-height="200" data-offset-y="0"></div>
  </div>

  <div class="outer">
    <div style="inset: 0; max-height: stretch; width: 100px;"
      data-expected-height="200" data-offset-y="0"></div>
  </div>

  <div class="outer">
    <div style="top: 0; bottom: 0; left: 25px; right: 25px; width: stretch;"
      data-expected-width="150" data-offset-x="25"></div>
  </div>

  <div class="outer">
    <div
      style="top: 25px; bottom: 25px; left: 0px; right: 0px; height: stretch;"
      data-expected-height="150" data-offset-y="25"></div>
  </div>