third_party/WebKit/LayoutTests/compositing/overflow/rtl-overflow-expected.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4   <title>Composited overflow scrolling for RTL</title>
   5   <style>
   6     .container {
   7       width: 400px;
   8       height: 150px;
   9       overflow: scroll;
  10     }
  11     .container::-webkit-scrollbar {
  12       width: 0;
  13       height: 0;
  14     }
  15     .overflow {
  16       display: inline-block;
  17       width: 1000px;
  18       position: relative;
  19     }
  20     .right {
  21       width: 100px;
  22       height: 100px;
  23       position: absolute;
  24       right: 0;
  25       background-color: red;
  26     }
  27     .left {
  28       width: 100px;
  29       height: 100px;
  30       position: absolute;
  31       left: 0;
  32       background-color: blue;
  33     }
  34   </style>
  35 </head>
  36 <body>
  37   <div style="transform:translateZ(0);">
  38     This test succeeds if the two blocks correctly show content scrolled to the rightmost and leftmost respectively.
  39   </div>
  40   <div class="container" id="first">
  41     <div class="overflow">
  42       <div class="left"></div>
  43       <div class="right"></div>
  44     </div>
  45   </div>
  46   <div class="container">
  47     <div class="overflow">
  48       <div class="left"></div>
  49       <div class="right"></div>
  50     </div>
  51   </div>
  52   <script>
  53     document.getElementById('first').scrollLeft = 600;
  54   </script>
  55 </body>
  56 </html>