| <!DOCTYPE html> |
| <p>There should be a blue <em>square</em> below.</p> |
| <div style="columns:2; column-fill:auto; height:90px; line-height:20px; widows:3;"> |
| <div id="lines" style="position:relative; width:400px; height:110px;"> |
| <div id="abspos" style="position:absolute; width:25%; height:25px; top:0; left: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.offsetWidth, 100); |
| lines.style.width = "100px"; |
| assert_equals(abspos.offsetWidth, 25); |
| }, "Resize container with percent-width abspos and widows"); |
| </script> |