grid-align-baseline-fieldset-001.html (1155B)
1 <!DOCTYPE html> 2 <link rel="help" href="https://github.com/w3c/csswg-drafts/issues/7656#issuecomment-1248617134"> 3 <style> 4 .target { 5 display: grid; 6 width: min-content; 7 grid-auto-flow: column; 8 position: relative; 9 line-height: 0; 10 } 11 .target > div { 12 background: hotpink; 13 font-size: 30px; 14 } 15 fieldset { 16 padding: 10px; 17 border: solid 10px; 18 margin: 0; 19 font-size: 20px; 20 } 21 span { 22 display: inline-block; 23 width: 1em; 24 height: 1em; 25 outline: solid cyan 3px; 26 outline-offset: -3px; 27 } 28 </style> 29 <script src="/resources/testharness.js"></script> 30 <script src="/resources/testharnessreport.js"></script> 31 <script src="/resources/check-layout-th.js"></script> 32 <body onload="checkLayout('.target > *')"> 33 34 <div class="target" style="align-items: first baseline;"> 35 <div data-offset-y="20"><span></span></div> 36 <fieldset data-offset-y="0"> 37 <legend><span></span></legend> 38 <span></span><br><span></span> 39 </table> 40 </div> 41 42 <div class="target" style="align-items: last baseline;"> 43 <div data-offset-y="40"><span></span></div> 44 <fieldset data-offset-y="0"> 45 <span></span><br><span></span> 46 <legend><span></span></legend> 47 </table> 48 </div>