text-box-on-non-root-inline-box.html (1098B)
1 <!DOCTYPE html> 2 <title>text-box on non-root inline box does not affect layout bounds only the box's size.</title> 3 <link rel="help" href="https://drafts.csswg.org/css-inline-3/#text-box-trim"> 4 <link rel="help" href="https://drafts.csswg.org/css-inline-3/#text-box-edge"> 5 <style> 6 @import "support/TestMetricsFont.css"; 7 8 div { 9 font-family: MetricsTestFont; 10 font-size: 12px; 11 } 12 .aqua { 13 background-color: aqua; 14 } 15 </style> 16 <script src="/resources/testharness.js"></script> 17 <script src="/resources/testharnessreport.js"></script> 18 <script src="/resources/check-layout-th.js"></script> 19 <body onload="checkLayout('.aqua')"> 20 <div> 21 <span class=aqua style="text-box: ex alphabetic;" data-offset-y=16 data-expected-height=2>ApÉx</span> 22 <span class=aqua style="text-box: trim-start cap alphabetic; data-offset-y=14 data-expected-height=10">ApÉx</span> 23 <span class=aqua style="text-box: trim-end text alphabetic;" data-offset-y=8 data-expected-height=10>ApÉx</span> 24 </div> 25 <div class=aqua data-expected-height=18> 26 <span style="font-size: 18px; text-box: ex alphabetic;">ApÉx</span> 27 </div> 28 </body>