flipped-blocks-border-after-expected.html

<!DOCTYPE html>
<style>
    .test { position: absolute; }
    .pos1 { left: 50px; top: 50px;}
    .pos2 { left: 250px; top: 50px;}
    .pos3 { left: 50px; top: 300px;}

    .multicol {
        border: 0 solid black;
        background-color: green;
        width: 100px;
        height: 100px;
    }

    .horizontal_tb { border-bottom-width: 50px; }
    .vertical_rl { border-left-width: 50px; }
    .vertical_lr { border-right-width: 50px; }
</style>
<p>
    There should be four green squares below, plus a large black border on one side, as
    indicated. There should be no red.
</p>
<div class="test pos1">
    <p>Border below</p>
    <div class="multicol horizontal_tb"></div>
</div>
<div class="test pos2">
    <p>Border left</p>
    <div class="multicol vertical_rl"></div>
</div>
<div class="test pos3">
    <p>Border right</p>
    <div class="multicol vertical_lr"></div>
</div>

chromium/third_party/blink/web_tests/fast/multicol/flipped-blocks-border-after-expected.html