orthogonal-floats-1a.html (1151B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Bug 1141867 - Contiguous right-floating boxes with vertical writing mode</title> 5 <!-- based on testcases from Gerard Talbot, see https://bugzilla.mozilla.org/show_bug.cgi?id=1141867 --> 6 <meta charset="utf-8"> 7 <style type="text/css"> 8 body { 9 margin: 8px; 10 } 11 p { 12 clear: both; 13 } 14 div.floated-right { 15 background: green; 16 color: green; 17 inline-size: 100px; 18 block-size: 20px; 19 float: right; 20 -ah-writing-mode: vertical-rl; 21 -webkit-writing-mode: vertical-rl; 22 writing-mode: tb-rl; /* IE 11 */ 23 writing-mode: vertical-rl; 24 } 25 div#reference-overlapped-red { 26 background-color: red; 27 width: 100px; 28 height: 100px; 29 position: absolute; 30 right: 8px; 31 top: 8px; 32 z-index: -1; 33 } 34 </style> 35 </head> 36 37 <body> 38 39 <div class="floated-right"></div> 40 41 <div class="floated-right"></div> 42 43 <div class="floated-right"></div> 44 45 <div class="floated-right"></div> 46 47 <div class="floated-right"></div> 48 49 <div id="reference-overlapped-red"></div> 50 51 <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> 52 53 </body> 54 </html>