Blitz - WPT: box-shadow-005.html

wpt / css / css-break / box-shadow-005.html

<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://www.w3.org/TR/css-break-3/#break-decoration">
<link rel="match" href="box-shadow-005-ref.html">
<p>Box shadows should be painted around all of the three fragments.</p>
<div style="columns:3; column-gap:50px; column-fill:auto; margin:50px; inline-size:400px; block-size:100px; background:yellow;">
  <div style="box-decoration-break:clone; box-shadow:0px 0px 0px 10px; inline-size:50px; block-size:250px;"></div>
</div>

/css/css-break/box-shadow-005-ref.html

<!DOCTYPE html>
<style>
  #mc > div {
    position: absolute;
    inset-block-start:-10px;
    inline-size: 50px;
    border: 10px solid;
  }
</style>
<p>Box shadows should be painted around all of the three fragments.</p>
<div id="mc" style="position:relative; margin:50px; inline-size:400px; block-size:100px; background:yellow;">
  <div style="inset-inline-start:-10px; block-size:100px;"></div>
  <div style="inset-inline-start: 140px; block-size:100px;"></div>
  <div style="inset-inline-start: 290px; block-size:50px;"></div>
</div>