text-decoration-inset-007.html (844B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 4 <title>CSS Text Decoration 4: text-decoration-inset</title> 5 6 <link rel="help" href="https://drafts.csswg.org/css-text-decor-4/#text-decoration-skip-inset-property"> 7 <link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com"> 8 9 <link rel="match" href="reference/text-decoration-inset-007-ref.html"> 10 11 <style> 12 body { 13 background: white; 14 color: black; 15 font-family: times new roman, serif; 16 } 17 div { 18 position: relative; 19 } 20 h1 { 21 position: absolute; 22 } 23 u { 24 text-decoration-skip-ink: none; 25 text-decoration-color: black; 26 text-decoration-inset: 10px -10px; 27 text-underline-offset: 10px; 28 } 29 </style> 30 31 <p>The underline for "جلدي brown" should be offset by 10px to the right, and not interrupted at the direction boundary:</p> 32 33 <div> 34 <h1> 35 the <u>جلدي brown</u> fox 36 </h1> 37 </div>