<!DOCTYPE html>
<p>There should be a hotpink square in the bottom right corner of a black square.</p>
<div style="position:relative; columns:2; column-gap:0; column-fill:auto; width:100px; height:100px; background:black;">
<div style="height:60px;"></div>
<div id="elm" style="float:left; margin-top:50px; width:100%; height:50px; background:hotpink;"></div>
</div>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<script>
test(() => {
var elm = document.getElementById("elm");
assert_equals(elm.offsetTop, 50);
assert_equals(elm.offsetLeft, 50);
}, "Should not split the top margin of a float.");
</script>