writing-mode-vertical-rl-002.xht (1559B)
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"> 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 <head> 5 <title>CSS Test: writing-mode: vertical-rl - basic inline case</title> 6 <link rel="author" title="Yoshifumi Kawai" href="mailto:kawai@est.co.jp" /> 7 <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"/> 8 <link rel="help" title="CSS3 Writing modes: 3.1. Block Flow Direction: the 'writing-mode' property" href="http://www.w3.org/TR/css-writing-modes-3/#propdef-writing-mode" /> 9 <link rel="match" href="reference/writing-mode-vertical-rl-002-ref.xht"/> 10 <meta name="flags" content="ahem" /> 11 <meta content="This tests the block flow direction. The writing mode is vertical, and the block flow is right to left." /> 12 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> 13 <style type="text/css"><![CDATA[ 14 div 15 { 16 background: yellow; 17 color: blue; 18 font: 20px/1 Ahem; 19 height: 6em; 20 margin: 10px; 21 width: 6em; 22 } 23 24 #test 25 { 26 writing-mode: vertical-rl; 27 } 28 ]]></style> 29 </head> 30 <body> 31 <p>The upper block is identical to the lower block including each character positions.</p> 32 <div id="test">ab cd 33 e fg h 34 i jkl 35 mn o q 36 rs t 37 uv</div> 38 <div id="control">urmiea 39 vsn x 40 jf 41 tokgc 42 l d 43 q h</div> 44 </body> 45 </html>