text-underline-position-left-001.xht (1479B)
1 <?xml version="1.0" encoding="UTF-8"?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title>CSS Text Decoration Test: text-underline-position - left</title> 5 <link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp" /> 6 <link rel="help" title="2.6. Text Underline Position" href="http://www.w3.org/TR/css-text-decor-3/#text-underline-position-property" /> 7 <meta name="flags" content="ahem" /> 8 <meta name="assert" content="This tests checks that there is underline in a position under the descenders." /> 9 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> 10 <style type="text/css"><![CDATA[ 11 12 span#ahem_text 13 { 14 position: absolute; 15 left: 0; 16 border: 1px dashed silver; 17 18 font-family: ahem; 19 font-size: 6.25em; /* equivalent to 100px */ 20 line-height: 1.0; 21 color: orange; 22 } 23 24 span#sample_text_underline 25 { 26 position: absolute; 27 left: 0; 28 text-decoration: underline; 29 text-underline-position: left; 30 color:blue; 31 } 32 33 span#sample_text 34 { 35 color: silver; 36 font-size: 6.25em; /* equivalent to 100px */ 37 line-height: 1.0; 38 } 39 40 ]]></style> 41 </head> 42 <body> 43 <p>Test passes if there is a blue line inside the orange region.</p> 44 45 <span id="ahem_text">ppp</span> 46 <span id="sample_text_underline"> 47 <span id="sample_text">sample</span> 48 </span> 49 50 </body> 51 </html>