| <!DOCTYPE html> |
| <p>There should be a blue <em>square</em> below.</p> |
| <div style="margin-left:100px; width:50px; height:25px; background:blue;"></div> |
| <div style="columns:2; column-fill:auto; height:90px; line-height:20px; widows:3;"> |
| <div id="lines" style="position:relative; width:100px; height:110px;"> |
| <div id="abspos" style="position:absolute; width:50px; height:25px; top:0; right:0; background:blue;"></div> |
| <br> |
| <br> |
| <br> |
| <br> |
| <br> |
| </div> |
| </div> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <script> |
| test(() => { |
| var lines = document.getElementById("lines"); |
| var abspos = document.getElementById("abspos"); |
| assert_equals(abspos.offsetLeft, 50); |
| lines.style.width = "150px"; |
| assert_equals(abspos.offsetLeft, 100); |
| }, "Resize container with right-aligned abspos and widows"); |
| </script> |
