text-underline-position-right-002.xht (1624B)
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 - right in vertical writing mode</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 to the right of the text in vertical writing mode." /> 9 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> 10 <style type="text/css"><![CDATA[ 11 12 div 13 { 14 writing-mode: vertical-rl; 15 16 } 17 18 span#ahem_text 19 { 20 position: absolute; 21 left: 0; 22 border: 1px dashed silver; 23 24 font-family: ahem; 25 font-size: 6.25em; /* equivalent to 100px */ 26 line-height: 1.0; 27 color: orange; 28 } 29 30 span#sample_text_underline 31 { 32 position: absolute; 33 left: 0; 34 color:blue; 35 36 text-decoration: underline; 37 text-underline-position: right; 38 } 39 40 span#sample_text 41 { 42 color: silver; 43 font-size: 6.25em; /* equivalent to 100px */ 44 line-height: 1.0; 45 } 46 47 48 ]]></style> 49 </head> 50 <body> 51 <p>Test passes if there is a blue vertical line on the right side of the orange region.</p> 52 53 <div> 54 <span id="ahem_text">ÉÉÉ</span> 55 <span id="sample_text_underline"> 56 <span id="sample_text">sample</span> 57 </span> 58 </div> 59 60 </body> 61 </html>