horizontal-rule-vlr-005.xht (1343B)
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'</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-vrl-004-ref.xht" /> 12 13 <meta content="This test checks that an horizontal rule (<hr> element) with 'vertical-lr' writing-mode but inside an 'horizontal-tb' writing-mode context must be rendered as an horizontal rule." name="assert" /> 14 15 <style type="text/css"><![CDATA[ 16 hr 17 { 18 background-color: green; 19 border: transparent none 0px; 20 height: 10px; 21 margin: 0px; 22 width: 100%; 23 writing-mode: vertical-lr; 24 } 25 26 div#overlapped-red 27 { 28 background-color: red; 29 bottom: 10px; 30 height: 10px; 31 position: relative; 32 width: auto; 33 z-index: -1; 34 } 35 ]]></style> 36 37 </head> 38 39 <body> 40 41 <p>Test passes if there is an horizontal green bar and <strong>no red</strong>.</p> 42 43 <hr></hr> 44 45 <div id="overlapped-red"></div> 46 47 </body> 48 </html>