<!DOCTYPE html>
<style>
.multicol { float:left; position:relative; columns:2; column-fill:auto; width:3em; height:40px; line-height:20px; }
</style>
<div class="multicol">
<div id="line" style="margin-top:-10px;"><br></div>
</div>
<div class="multicol">
<div id="lineAndBorder" style="margin-top:-10px; border-top:5px solid;"><br></div>
</div>
<div class="multicol">
<div id="lineAtBoundaryAndBorder" style="margin-top:-10px; border-top:10px solid;"><br></div>
</div>
<div class="multicol">
<div style="position:relative;">
<div id="absPos" style="position:absolute; top:-10px;">
<div id="lineInAbsPos"><br></div>
</div>
</div>
</div>
<div class="multicol">
<div style="margin-top:-15px; border-top:5px solid;">
<div id="lineInNestedBlock" style="border-top:15px solid;"><br></div>
</div>
</div>
<div class="multicol">
<div style="margin-top:-10px;" id="lineAfterFloat">
<div style="float:left; width:100%; height:20px;"></div>
<br>
</div>
</div>
<div class="multicol">
<div id="unsplittableBlock" style="margin-top:-10px; height:20px; break-inside:avoid;"></div>
</div>
<div class="multicol">
<div id="unsplittableFloat" style="float:left; margin-top:-10px; height:20px; break-inside:avoid;"></div>
</div>
<div class="multicol">
<div id="unsplittableAbspos" style="position:absolute; top:-10px; height:20px; break-inside:avoid;"></div>
</div>
<div class="multicol">
<img id="image" style="display:block; margin-top:-10px; height:20px;">
</div>
<div style="clear:both;"></div>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<script>
function pos(elm) { return document.getElementById(elm).offsetTop; }
generate_tests(assert_equals, [
[ "line", pos("line"), -10 ],
[ "lineAndBorder", pos("lineAndBorder"), -10 ],
[ "lineAtBoundaryAndBorder", pos("lineAtBoundaryAndBorder"), -10 ],
[ "lineInAbspos", pos("lineInAbsPos"), 0 ],
[ "abspos", pos("absPos"), -10 ],
[ "lineInNestedBlock", pos("lineInNestedBlock"), -10 ],
[ "lineAfterFloat", pos("lineAfterFloat"), -10 ],
[ "unsplittableBlock", pos("unsplittableBlock"), -10 ],
[ "unsplittableFloat", pos("unsplittableFloat"), -10 ],
[ "unsplittableAbspos", pos("unsplittableAbspos"), -10 ],
[ "image", pos("image"), -10 ],
]);
</script>