horizontal-rule-vlr-003.xht (1444B)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 5 <head> 6 7 <title>CSS Writing Modes Test: horizontal rule - 'vertical-lr' and orthogonal flow</title> 8 9 <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" /> 10 <link rel="help" title="7.1 Principles of Layout in Vertical Writing Modes" href="http://www.w3.org/TR/css-writing-modes-3/#vertical-layout" /> 11 <link rel="match" href="horizontal-rule-vlr-003-ref.xht" /> 12 13 <meta content="image" name="flags" /> 14 <meta content="This test checks that an horizontal rule (<hr> element) in 'vertical-lr' writing-mode must be rendered as a vertical rule." name="assert" /> 15 16 <style type="text/css"><![CDATA[ 17 html 18 { 19 writing-mode: vertical-lr; 20 } 21 22 body 23 { 24 margin: 0px; 25 } 26 27 hr 28 { 29 background-color: green; 30 border: transparent none 0px; 31 height: auto; 32 margin: 0px; 33 width: 10px; 34 } 35 36 div#overlapped-red 37 { 38 background-color: red; 39 height: 100%; 40 position: relative; 41 right: 10px; 42 width: 10px; 43 z-index: -1; 44 } 45 ]]></style> 46 47 </head> 48 49 <body> 50 51 <p><img src="support/pass-cdts-horiz-rule.png" width="260" height="36" alt="Image download support must be enabled" /></p> 52 53 <hr></hr> 54 55 <div id="overlapped-red"></div> 56 57 </body> 58 </html>