writing-mode-vertical-rl-001.xht (1534B)
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-001-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 white-space: pre; 22 width: 6em; 23 } 24 25 #test 26 { 27 writing-mode: vertical-rl; 28 } 29 ]]></style> 30 </head> 31 <body> 32 <p>The upper block is identical to the lower block including each character positions.</p> 33 <div id="test">ab cd 34 e fg h 35 i jkl 36 mn 37 o q rs 38 t uv</div> 39 <div id="control">tomiea 40 n b 41 uq jf 42 v kgc 43 r l d 44 s h</div> 45 </body> 46 </html>