valid-spanner-container-becomes-invalid.html

<!DOCTYPE html>
<p>There should be two blue squares below.</p>
<div id="multicol" style="columns:2; column-gap:50px; width:150px;">
    <div id="changeMe" style="width:50px;">
        <div id="spanner" style="column-span:all; height:100px; background:blue;"></div>
    </div>
</div>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script>
test(() => {
    var multicol = document.getElementById("multicol");
    var spanner = document.getElementById("spanner");
    var changeMe = document.getElementById('changeMe');
    document.documentElement.offsetTop;

    changeMe.style.cssFloat = 'left';
    assert_equals(multicol.offsetHeight, 50);
    assert_equals(spanner.offsetWidth, 50);
}, "Turn a spanner's parent from regular block into float");
</script>

chromium/third_party/blink/web_tests/fast/multicol/dynamic/valid-spanner-container-becomes-invalid.html