<!DOCTYPE html>
<style>
body { overflow:scroll; } /* A second layout pass might hide bugs. */
</style>
<p>There should be a blue, a cyan, and another blue square below, stacked vertically.</p>
<div id="multicol" style="columns:3; column-gap:0; column-fill:auto; width:60px; height:99px; line-height:20px; orphans:1; widows:1;">
<br>
<br>
<br>
<table cellspacing="0" cellpadding="0">
<thead>
<tr>
<td style="vertical-align:top;"><br><br></td>
<td style="vertical-align:top;"><br><br></td>
</tr>
</thead>
<tbody>
<tr data-expected-height="60">
<td data-expected-height="60"><br><br><br></td>
<td data-expected-height="60" style="background:blue;">
<div data-offset-y="20" data-expected-height="20" style="width:20px; background:cyan;"><br></div>
</td>
</tr>
</tbody>
</table>
</div>
<script src="../resources/check-layout.js"></script>
<script>
checkLayout("#multicol");
</script>