xulscroll.html (3731B)
1 <!-- Any copyright is dedicated to the Public Domain. 2 - http://creativecommons.org/publicdomain/zero/1.0/ --> 3 <!DOCTYPE HTML> 4 <html class="reftest-wait"><head> 5 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 6 <title>Testcase for bug 672944</title> 7 <style type="text/css"> 8 @font-face { 9 font-family: DejaVuSansMono; 10 src: url(../fonts/DejaVuSansMono.woff),url(DejaVuSansMono.woff); 11 } 12 html,body { 13 color:black; background-color:white; font-size:16px; padding:0; margin:0; font-family:DejaVuSansMono; 14 } 15 16 .bacon { 17 white-space: nowrap; 18 text-overflow: ellipsis ellipsis; 19 overflow: hidden; 20 width: 30ch; 21 display: -moz-box; 22 background: lime; 23 margin-bottom: 1em; 24 } 25 26 .auto { 27 overflow-x: auto; 28 padding-bottom: 2ch; 29 width: 29.5ch; 30 text-overflow: "" ""; 31 } 32 .scroll { 33 overflow: auto; 34 padding: 2ch; 35 border: 3px solid black; 36 text-overflow: "" ""; 37 } 38 .scroll2 { 39 overflow: auto; 40 padding: 3ch; 41 text-overflow: "" ""; 42 } 43 .scroll3 { 44 overflow: auto; 45 padding: 2ch; 46 text-indent: -3ch; 47 text-overflow: "" ""; 48 } 49 .scroll4 { 50 overflow: auto; 51 padding: 2ch 0.2ch; 52 text-overflow: "" ""; 53 } 54 span { background-color:white; } 55 56 #block-hover { 57 position:fixed; 58 top:0;left:0;width:100%;height:100%; 59 } 60 </style> 61 <script type="text/javascript"> 62 function init() { 63 64 // The behaviour of this test may be subtly different when this code runs 65 // before the first paint vs after the first paint. If you encounter 66 // intermittent failures in this reftest, you might have luck turning it into 67 // a reliable failure by wrapping this function body in a 68 // requestAnimationFrame callback to force it to run after the first paint. 69 // Alternatively you might need to force it to run before the first paint, 70 // perhaps by running it inline (not as an onload handler) or something. 71 72 // workaround bug 936936 73 document.body.style.display = "block"; 74 document.body.getBoundingClientRect(); 75 76 document.getElementById('rtl_auto').scrollLeft=999999; 77 78 document.documentElement.removeAttribute('class'); 79 } 80 </script> 81 </head> 82 <body onload="init();" style="display: inline;"> 83 84 <div style="float:right;" dir="rtl"> 85 <div class="bacon"><span>1Beef hamburger bacon tri-tip, jowl biltong tail ribeye ham</span></div><br> 86 <div id="rtl_auto" class="bacon auto"><span>2Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br> 87 <div class="bacon scroll"><span>3Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br> 88 <div class="bacon scroll2"><span>4Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br> 89 <div class="bacon scroll3"><span>5Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br> 90 <div class="bacon scroll4"><span>6Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br> 91 </div> 92 93 <div> 94 <div class="bacon"><span>1Beef hamburger bacon tri-tip, jowl biltong tail ribeye ham</span></div><br> 95 <div class="bacon auto"><span>2Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br> 96 <div class="bacon scroll"><span>3Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br> 97 <div class="bacon scroll2"><span>4Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br> 98 <div class="bacon scroll3"><span>5Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br> 99 <div class="bacon scroll4"><span>6Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br> 100 </div> 101 102 <div id="block-hover"></div> 103 </body> 104 </html>