| <!DOCTYPE html> |
| <style>body { margin:8px; }</style> |
| <div style="columns:1; width:10px; height:200px; column-fill:auto;"> |
| <div id="elm" style="margin-left:-20px; margin-top:-25px; width:4000px; height:40px;"></div> |
| </div> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script> |
| test(() => { |
| var elm = document.getElementById("elm"); |
| var rects = elm.getClientRects(); |
| assert_equals(rects.length, 1); |
| var rect = rects[0]; |
| // #elm is offset -20px,-25px relatively to its multicol container, due |
| // to negative margins. BODY is offset 8px,8px due to its margin. So the |
| // absolute offset will be (-20px+8px),(-25px+8px) = -12px,-17px. The |
| // width and height will be the unclipped bounding box of #elm. |
| assert_equals(rect.left, -12); |
| assert_equals(rect.top, -17); |
| assert_equals(rect.width, 4000); |
| assert_equals(rect.height, 40); |
| }, "getClientRects should include overflow"); |
| </script> |
