layout/reftests/text-overflow/bidi-simple-scrolled-ref.html

Fri, 16 Jan 2015 18:13:44 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Fri, 16 Jan 2015 18:13:44 +0100
branch
TOR_BUG_9701
changeset 14
925c144e1f1f
permissions
-rw-r--r--

Integrate suggestion from review to improve consistency with existing code.

michael@0 1 <!DOCTYPE HTML>
michael@0 2 <!--
michael@0 3 Any copyright is dedicated to the Public Domain.
michael@0 4 http://creativecommons.org/licenses/publicdomain/
michael@0 5 -->
michael@0 6 <html class="reftest-wait"><head>
michael@0 7 <title>text-overflow: simple mixed-bidi cases</title>
michael@0 8 <style type="text/css">
michael@0 9 @font-face {
michael@0 10 font-family: DejaVuSansMono;
michael@0 11 src: url(../fonts/DejaVuSansMono.woff);
michael@0 12 }
michael@0 13 html,body {
michael@0 14 color:black; background-color:white; font-size:16px; padding:0; margin:0; font-family:DejaVuSansMono;
michael@0 15 }
michael@0 16
michael@0 17 .test {
michael@0 18 overflow:auto;
michael@0 19 white-space:nowrap;
michael@0 20 width: 4.4em;
michael@0 21 margin-bottom:1em;
michael@0 22 position:relative;
michael@0 23 line-height:2em;
michael@0 24 }
michael@0 25
michael@0 26 .hidden {
michael@0 27 overflow:hidden;
michael@0 28 width: 4.7em;
michael@0 29 }
michael@0 30
michael@0 31 .rlo {
michael@0 32 unicode-bidi: bidi-override; direction: rtl;
michael@0 33 }
michael@0 34 .lro {
michael@0 35 unicode-bidi: bidi-override; direction: ltr;
michael@0 36 }
michael@0 37 .rtl {
michael@0 38 direction:rtl;
michael@0 39 }
michael@0 40 rr {
michael@0 41 position:absolute;
michael@0 42 bottom:0; right:8px;
michael@0 43 }
michael@0 44 r {
michael@0 45 position:absolute;
michael@0 46 bottom:0; right:-8px;
michael@0 47 }
michael@0 48 ll {
michael@0 49 position:absolute;
michael@0 50 bottom:0; left:8px;
michael@0 51 }
michael@0 52 l {
michael@0 53 position:absolute;
michael@0 54 bottom:0; left:-8px;
michael@0 55 }
michael@0 56
michael@0 57 </style>
michael@0 58 <script>
michael@0 59 function scrolldivs() {
michael@0 60 var divs = document.getElementsByTagName('div');
michael@0 61 for (i = 0; i < divs.length; ++i) {
michael@0 62 if (window.getComputedStyle(divs[i]).direction == 'ltr')
michael@0 63 divs[i].scrollLeft = 8;
michael@0 64 else
michael@0 65 divs[i].scrollLeft = -8;
michael@0 66 }
michael@0 67 document.documentElement.removeAttribute('class');
michael@0 68 }
michael@0 69 </script>
michael@0 70
michael@0 71 </head><body onload="scrolldivs()">
michael@0 72
michael@0 73 <!-- LTR block -->
michael@0 74
michael@0 75 <div class="test"><ll>&#x2026;</ll><r>&#x2026;</r>&nbsp;&nbsp;xxB&nbsp;<span class="rlo">&#x2026;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>&nbsp;&nbsp;&nbsp;&nbsp;xxxx<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span></div>
michael@0 76
michael@0 77 <div class="test"><ll>&#x2026;</ll><r>&#x2026;</r><span class="rlo">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Wor&nbsp;&nbsp;</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;B<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span></div>
michael@0 78
michael@0 79 <div class="test"><ll>&#x2026;</ll><r>&#x2026;</r><span class="rlo">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Wor&nbsp;&nbsp;</span></div>
michael@0 80
michael@0 81 <!-- RTL block -->
michael@0 82 <div class="test rtl"><rr>&#x2026;</rr><l>&#x2026;</l>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">&nbsp;&nbsp;llo&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></div>
michael@0 83
michael@0 84 <div class="test rtl"><rr>&#x2026;</rr><l>&#x2026;</l><span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">&nbsp;&nbsp;llo&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></div>
michael@0 85
michael@0 86 <div class="test rtl"><rr>&#x2026;</rr><l>&#x2026;</l><span class="rlo">&nbsp;&nbsp;llo&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></div>
michael@0 87
michael@0 88
michael@0 89 <div class="test rtl hidden">AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">&nbsp;&#x2026;lloWo&#x2026;&nbsp;&nbsp;</span></div>
michael@0 90
michael@0 91 <div class="test rtl hidden"><span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">&nbsp;&#x2026;lloWo&#x2026;&nbsp;&nbsp;</span></div>
michael@0 92
michael@0 93 <div class="test rtl hidden"><span class="rlo">&nbsp;&#x2026;lloWo&#x2026;&nbsp;&nbsp;</span></div>
michael@0 94
michael@0 95
michael@0 96 <div class="test hidden">&nbsp;&#x2026;xxxB<span class="rlo">Hello&nbsp;&nbsp;&nbsp;&#x2026;d</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span></div>
michael@0 97
michael@0 98 <div class="test hidden"><span class="rlo">&nbsp;&nbsp;&#x2026;loWor&#x2026;&nbsp;</span>&nbsp;xxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span>AxxxxB<span class="rlo">HelloWorld</span></div>
michael@0 99
michael@0 100 <div class="test hidden"><span class="rlo">&nbsp;&nbsp;&#x2026;loWor&#x2026;&nbsp;</span></div>
michael@0 101
michael@0 102 <span style="position:absolute; top:0; left:6em; height:6em; overflow:hidden;">
michael@0 103 <div class="test rtl"><br><br><rr>&#x2026;</rr><l>&#x2026;</l><span class="rlo">&nbsp;&nbsp;lloW&nbsp;&nbsp;&nbsp;&nbsp;HelloWorldHelloWorldHelloWorldHelloWorldHelloWorldHelloWorldHelloWorld</span></div>
michael@0 104 </span>
michael@0 105
michael@0 106 </body></html>

mercurial