thead-near-start-of-first-fragmentainer.html

<!DOCTYPE html>
<p>Below there should be a black square surrounded by a rather thick
    (10px wide) hotpink border on all sides.</p>
<div style="columns:2; column-fill:auto; height:300px;">
    <div style="height:10px;"></div>
    <table id="table" style="border-spacing:10px; width:120px; background:hotpink;">
        <thead style="break-inside:avoid;">
            <tr>
                <td id="cell" style="padding:0;">
                    <div id="pete" style="width:99px; height:100px; background:black;"></div>
                </td>
            </tr>
        </thead>
    </table>
</div>
<script>
</script>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<script>
test(() => {
    document.body.offsetTop;
    document.getElementById("pete").style.width = "100px";
    assert_equals(document.getElementById("cell").offsetTop, 10);
    assert_equals(document.getElementById("table").offsetHeight, 120);
}, "THEAD near the top of the first fragmentainer");
</script>

chromium/third_party/blink/web_tests/fragmentation/thead-near-start-of-first-fragmentainer.html