| <!DOCTYPE html> |
| <title>Bug 91756: Test if the widths of RTL elements are the same as the widths of the LTR elements when they include absolutely-positioned children.</title> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <style> |
| div.outer { overflow: auto; width: 100px; position: relative; height: 100px; border: solid; } |
| div.inner { position: absolute; top: 250px; } |
| </style> |
| <body> |
| <div id="outerLTR" class="outer"><div id="innerLTR" class="inner" style="left: 200px;">foo</div></div> |
| <div id="outerRTL" class="outer" style="direction: rtl;"><div id="innerRTL" class="inner" style="right: 200px;">foo</div> |
| </div> |
| <script> |
| test(function() { |
| // Verify the widths of the outer RTL element are the same as the widths of the outer LTR element. |
| var outerLTR = document.getElementById("outerLTR"); |
| var outerRTL = document.getElementById("outerRTL"); |
| assert_equals(outerLTR.offsetWidth, outerRTL.offsetWidth); |
| assert_equals(outerLTR.clientWidth, outerRTL.clientWidth); |
| assert_equals(outerLTR.scrollWidth, outerRTL.scrollWidth); |
| |
| // Verify the widths of the inner RTL element are the same as the widths of the inner LTR element. |
| var innerLTR = document.getElementById("innerLTR"); |
| var innerRTL = document.getElementById("innerRTL"); |
| assert_equals(innerLTR.offsetWidth, innerRTL.offsetWidth); |
| assert_equals(innerLTR.clientWidth, innerRTL.clientWidth); |
| assert_equals(innerLTR.scrollWidth, innerRTL.scrollWidth); |
| }); |
| </script> |
| </body> |