grid-align-baseline-fieldset-002.html (1184B)
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 grid-auto-flow: column; 7 width: min-content; 8 position: relative; 9 line-height: 0; 10 writing-mode: vertical-rl; 11 } 12 .target > div { 13 background: hotpink; 14 font-size: 30px; 15 } 16 fieldset { 17 padding: 10px; 18 border: solid 10px; 19 margin: 0; 20 font-size: 20px; 21 } 22 span { 23 display: inline-block; 24 width: 1em; 25 height: 1em; 26 outline: solid cyan 3px; 27 outline-offset: -3px; 28 } 29 </style> 30 <script src="/resources/testharness.js"></script> 31 <script src="/resources/testharnessreport.js"></script> 32 <script src="/resources/check-layout-th.js"></script> 33 <body onload="checkLayout('.target > *')"> 34 35 <div class="target" style="align-items: first baseline;"> 36 <div data-offset-x="35"><span></span></div> 37 <fieldset data-offset-x="0"> 38 <legend><span></span></legend> 39 <span></span><br><span></span> 40 </table> 41 </div> 42 43 <div class="target" style="align-items: last baseline;"> 44 <div data-offset-x="15"><span></span></div> 45 <fieldset data-offset-x="0"> 46 <span></span><br><span></span> 47 <legend><span></span></legend> 48 </table> 49 </div>