blob: a11a9380d0474772bc1e69fd4be09d6b9b80c06b [file] [log] [blame]
<!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>