Blitz - WPT: grow-per-line-all-line-height.html

wpt / css / css-text / text-fit / grow-per-line-all-line-height.html

/css/css-text/text-fit/grow-per-line-all-line-height.html

<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-text-5/#text-fit-property">
<link rel="match" href="grow-per-line-all-line-height-ref.html">
<meta name="flags" content="ahem">
<link rel="stylesheet" href="/fonts/ahem.css">
<style>
.target {
  text-fit: grow per-line-all;
  white-space: pre;
  width: 100px;
  font: 10px/normal Ahem;
}
</style>
<body>
<div class="target" style="width:102px">AB<span style="border:1px solid lime">CD</span>E</div>

<!-- The border checks the line-heght of the last line. -->
<div class="target" style="border:1px solid green">AB
CDEFG</div>

<!-- Fixed line-height -->
<div class="target" style="line-height:20px;">AB
CDEFG</div>
</body>

/css/css-text/text-fit/grow-per-line-all-line-height-ref.html

<!DOCTYPE html>
<link rel="stylesheet" href="/fonts/ahem.css">
<style>
.target {
  white-space: pre;
  width: 100px;
  font: 10px/normal Ahem;
}
</style>
<body>
<div class="target" style="width:102px; font-size:20px">AB<span style="border:1px solid lime">CD</span>E</div>

<div class="target" style="border:1px solid green"><span style="font-size:50px">AB</span>
<span style="font-size:20px">CDEFG</span></div>

<div style="width:100px;">
  <div style="white-space:pre; font:50px/20px Ahem;">AB</div>
  <div style="white-space:pre; font:20px/20px Ahem;">CDEFG</div>
</div>
</body>