text-underline-offset-calc-ref.html (633B)
1 <!DOCTYPE html> 2 <meta charset="UTF-8"> 3 <title>text-underline-offset calc() support</title> 4 <link rel="author" title="Zak Ridouh" href="mailto:zakr@apple.com" /> 5 <link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#underline-offset" /> 6 <style> 7 div { 8 display: flex; 9 font-size: 22px; 10 } 11 .underline { 12 text-decoration-color: green; 13 text-decoration-line: underline; 14 text-decoration-thickness: 15px; 15 text-decoration-skip-ink: none; 16 } 17 .ref { 18 text-underline-offset: 1em; 19 } 20 </style> 21 <p>Test passes if black and green bar pairs are the same shape and size.</p> 22 <div> 23 <span class="underline ref">XXXXXX</span> 24 </div>