min-height-greater-than-content.html

<!DOCTYPE html>
<script src="../../resources/check-layout.js"></script>
<style>
    .box { width:20px; height:80px; -webkit-column-break-inside:avoid; background:blue; }
</style>
<p>Min-height should make the multicol container taller if min-height is greater than the content
    height, but it should not affect column balancing. We specify column-fill:auto here, but the
    columns should still be balanced, because height is auto. Note that in this test, the balanced
    content is shorter than min-height, which is what matters. The height of the uncolumnized
    content (i.e. the flowthread), on the other hand, is actually greater than min-height (but that
    shouldn't make any difference).</p>
<p>Below there should be a blue square above a yellow square.</p>
<div id="test" style="position:relative; columns:4; gap:0; width:80px; min-height:160px; background:yellow;">
    <div class="box" data-offset-y="0"></div>
    <div class="box" data-offset-y="0"></div>
    <div class="box" data-offset-y="0"></div>
    <div class="box" data-offset-y="0"></div>
</div>
<script>
    checkLayout("#test");
</script>
chromium/third_party/blink/web_tests/fast/multicol/min-height-greater-than-content.html
