| OLD | NEW | 
| (Empty) |  | 
 |   1 <!DOCTYPE html> | 
 |   2 <script> | 
 |   3 if (window.internals) { | 
 |   4     internals.settings.setCSSStickyPositionEnabled(true); | 
 |   5 }            | 
 |   6 </script> | 
 |   7  | 
 |   8 <html> | 
 |   9 <head> | 
 |  10 <style> | 
 |  11     #overflow { | 
 |  12         width: 600px; | 
 |  13         height: 450px; | 
 |  14         overflow: hidden; /* Still scrollable with JS */ | 
 |  15         border: 1px solid black; | 
 |  16     } | 
 |  17  | 
 |  18     .group { | 
 |  19         position: relative; | 
 |  20         width: 500px; | 
 |  21         height: 150px; | 
 |  22     } | 
 |  23  | 
 |  24     .container { | 
 |  25         width: 400px; | 
 |  26         height: 130px; | 
 |  27         outline: 2px solid black; | 
 |  28         direction: rtl; | 
 |  29     } | 
 |  30  | 
 |  31     .box { | 
 |  32         width: 200px; | 
 |  33         height: 130px; | 
 |  34     } | 
 |  35  | 
 |  36     .sticky { | 
 |  37         position: sticky; | 
 |  38         left: 600px; | 
 |  39         right: 100px; | 
 |  40         background-color: green; | 
 |  41     } | 
 |  42  | 
 |  43     .indicator { | 
 |  44         position: absolute; | 
 |  45         top: 0; | 
 |  46         left: 0; | 
 |  47         background-color: red; | 
 |  48     } | 
 |  49 </style> | 
 |  50 <script> | 
 |  51     function doTest() | 
 |  52     { | 
 |  53         document.getElementById('overflow').scrollLeft = 100; | 
 |  54     } | 
 |  55     window.addEventListener('load', doTest, false); | 
 |  56 </script> | 
 |  57 </head> | 
 |  58 <body> | 
 |  59 This test checks that left offset is ignored with overconstrained sticky positio
    ning and rtl text direction. | 
 |  60 There should be no red. | 
 |  61     <div id="overflow"> | 
 |  62         <div class="group" style="left: 400px"> | 
 |  63             <div class="indicator box" style="left: 0;"></div> | 
 |  64             <div class="container"> | 
 |  65                 <div class="sticky box"></div> | 
 |  66             </div> | 
 |  67         </div> | 
 |  68  | 
 |  69         <div class="group" style="left: 300px"> | 
 |  70             <div class="indicator box" style="left: 100px;"></div> | 
 |  71             <div class="container"> | 
 |  72                 <div class="sticky box"></div> | 
 |  73             </div> | 
 |  74         </div> | 
 |  75  | 
 |  76         <div class="group" style="left: 200px"> | 
 |  77             <div class="indicator box" style="left: 200px;"></div> | 
 |  78             <div class="container"> | 
 |  79                 <div class="sticky box"></div> | 
 |  80             </div> | 
 |  81         </div> | 
 |  82     </div> | 
 |  83 </body> | 
 |  84 </html> | 
| OLD | NEW |