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