| <!doctype html> |
| <title>CSS Test: background-attachment: local; positioning area with dir=rtl</title> |
| <link rel="match" href="attachment-local-positioning-3-ref.html" /> |
| <meta name="flags" content="dom" /> |
| <link rel="author" title="Simon Sapin" href="http://exyr.org/about/" /> |
| <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-attachment" /> |
| <style> |
| #outer { |
| border: solid; |
| /* 100% 100% == (250px - 32px) (370px - 32px) == 218px 338px */ |
| /* With scrolling, effective position is 178px 278px */ |
| background: url(aqua-yellow-32x32.png) local no-repeat 100% 100%; |
| overflow: hidden; |
| width: 200px; |
| height: 300px; |
| } |
| div div { |
| width: 250px; |
| height: 370px; |
| } |
| p { |
| margin: 0; |
| padding-top: 100px; |
| } |
| </style> |
| <div id=outer dir=rtl> |
| <div> |
| <p>Lorem ipsum dolor sit amet</p> |
| </div> |
| </div> |
| <script> |
| var outer = document.getElementById('outer'); |
| // See https://bugzilla.mozilla.org/show_bug.cgi?id=383026 for negative values. |
| outer.scrollLeft = -10; |
| outer.scrollTop = 60; |
| </script> |