forced-break-before-complex-margin-collapsing.html

<!DOCTYPE html>
<script src="../../resources/check-layout.js"></script>
<p>Given a parent block with a forced break before, and with an empty collapse-through child
    followed by a child with a top margin, check that the parent block is affected by the top
    margin of its second child. The collapse-through child prevents us from correctly estimating
    the logical top of the parent initially.</p>
<p>Below there should be a yellow box. There should be no red. In the first column, the word
    "first" should be seen once. In the second column, the word "second" should be seen twice. In the
    third column, the word "third" should be seen twice.</p>
<div id="test" style="position:relative; -webkit-columns:3; -webkit-column-gap:10px; column-fill:auto; width:620px; height:90px; line-height:20px; background:yellow;">
    <br>
    <br>
    <br>
    <div style="margin-bottom:300px;">first</div>
    <div style="-webkit-column-break-before:always; background:red;" data-offset-x="210" data-offset-y="45" data-expected-height="85">
        <div data-offset-x="210" data-offset-y="45" data-expected-height="0" style="background:red;"></div>
        <div style="margin-top:45px; background:yellow;" data-offset-x="210" data-offset-y="45" data-expected-height="85">
            second<br>second<br>third<br>third<br>
        </div>
    </div>
</div>
<script>
    checkLayout("#test");
</script>
chromium/third_party/blink/web_tests/fast/multicol/forced-break-before-complex-margin-collapsing.html
