self-collapsing-block-with-float-descendants-expected.html

<!doctype html>
<html>
    <body>
    <div style="overflow: hidden;">
        <p> webkit.org/b/119979: The green box should be under the blue box. </p>
        <div style="height: 20px; width: 50px; background-color: blue;">
            Text1
        </div>
        <div style="height:20px; width: 50px; background-color: green;">
            Text2
        </div>
    </div>

    <div style="overflow: hidden;">
        <p> webkit.org/b/119979: The green box should be under the blue box. </p>
        <div style="height: 20px; width: 50px; background-color: blue;">
            Text1
        </div>
        <div style="height:20px; width: 50px; background-color: green;">
            Text2
        </div>
    </div>

    <div style="overflow: hidden;">
        <p> webkit.org/b/119979: The green box should be under the blue box. </p>
        <div style="height: 20px; width: 50px; background-color: blue;">
            Text1
        </div>
        <div style="height:20px; width: 50px; background-color: green;">
            Text2
        </div>
    </div>

    <div style="overflow: hidden;">
        <p> webkit.org/b/119979: The three green boxes should be in a row. </p>
        <div>
            <div style="height:20px; width: 50px; float: left; background-color: green;">
                Text2
            </div>
            <div style="height:20px; width: 50px; float: left; background-color: green;">
                Text2
            </div>
            <div style="height:20px; width: 50px; float: left; background-color: green;">
                Text2
            </div>
        </div>
    </div>
    <div style="overflow: hidden;">
        <p> webkit.org/b/119979: The three green boxes should be in a row. </p>
        <div style="height: 20px; width: 50px; background-color: blue;">
            Text1
        </div>
        <div>
            <div style="height:20px; width: 50px; float: left; background-color: green;">
                Text2
            </div>
            <div style="height:20px; width: 50px; float: left; background-color: green;">
                Text2
            </div>
            <div style="height:20px; width: 50px; float: left; background-color: green;">
                Text2
            </div>
            <div>
            </div>
        </div>
    </div>
    <div style="overflow: hidden;">
        <p> webkit.org/b/119979: The three green boxes should be in a row. </p>
        <div style="height: 20px; width: 50px; background-color: blue;">
            Text1
        </div>
        <div>
            <div style="height:20px; width: 50px; float: left; background-color: green;">
                Text2
            </div>
            <div style="height:20px; width: 50px; float: left; background-color: green;">
                Text2
            </div>
            <div style="height:20px; width: 50px; float: left; background-color: green;">
                Text2
            </div>
            <div>
            </div>
        </div>
    </div>
    </body>
</html>
chromium/third_party/blink/web_tests/fast/block/margin-collapse/self-collapsing-block-with-float-descendants-expected.html
