<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>The multi-column model - CSS Multi-column Layout Module Level 1 CR Test Suite</title>
<style type="text/css">
@import "http://www.w3.org/StyleSheets/TR/base.css";
@import "../indices.css";
</style>
</head>
<body>
<h1>CSS Multi-column Layout Module Level 1 CR Test Suite</h1>
<h2>The multi-column model (12 tests)</h2>
<table width="100%">
<col id="test-column"></col>
<col id="refs-column"></col>
<col id="flags-column"></col>
<col id="info-column"></col>
<thead>
<tr>
<th>Test</th>
<th><abbr title="Rendering References">Refs</abbr></th>
<th>Flags</th>
<th>Info</th>
</tr>
</thead>
<tbody id="s2">
<tr><th colspan="4" scope="rowgroup">
<a href="#s2">+</a>
<a href="http://www.w3.org/TR/css3-multicol/#the-multi-column-model">2 The multi-column model</a></th></tr>
<!-- 12 tests -->
<tr id="multicol-collapsing-001-2" class="primary ahem">
<td><strong>
<a href="multicol-collapsing-001.xht">multicol-collapsing-001</a></strong></td>
<td><a href="reference/multicol-collapsing-001-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>no margin collapsing with its first child block box
<ul class="assert">
<li>This test checks that the top margin of the first child block box of a multicol element does not collapse with the margin top of such multicol element.</li>
</ul>
</td>
</tr>
<tr id="multicol-containing-001-2" class="primary ahem">
<td><strong>
<a href="multicol-containing-001.xht">multicol-containing-001</a></strong></td>
<td><a href="reference/multicol-containing-001-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>a column box can not act as containing block for elements with 'position: absolute'
<ul class="assert">
<li>This test checks that a column box does not establish containing block for elements with 'position: absolute'.</li>
</ul>
</td>
</tr>
<tr id="multicol-containing-002-2" class="primary ahem">
<td><strong>
<a href="multicol-containing-002.xht">multicol-containing-002</a></strong></td>
<td><a href="reference/multicol-containing-002-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>a multi-column can act as containing block for elements with 'position: absolute'
<ul class="assert">
<li>This test checks that a multi-column element can establish containing block for elements with 'position: absolute'.</li>
</ul>
</td>
</tr>
<tr id="multicol-height-002-2" class="primary">
<td><strong>
<a href="multicol-height-002.xht">multicol-height-002</a></strong></td>
<td><a href="reference/multicol-height-002.xht">=</a> </td>
<td></td>
<td>Percentage Computed Height on Multicol Child (Definite Multicol Height)
<ul class="assert">
<li>Percentage heights with a multi-column element are relative to the computed height of the multicolumn box, and this works even when the multi-column element is paginated.</li>
</ul>
</td>
</tr>
<tr id="multicol-height-block-child-001-2" class="primary ahem">
<td><strong>
<a href="multicol-height-block-child-001.xht">multicol-height-block-child-001</a></strong></td>
<td><a href="reference/multicol-height-block-child-001-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>multi-column element with child block (complex)
<ul class="assert">
<li>This test checks that a nested multi-column element's inline content could be clipped horizontally.</li>
</ul>
</td>
</tr>
<tr id="multicol-margin-child-001-2" class="primary ahem">
<td><strong>
<a href="multicol-margin-child-001.xht">multicol-margin-child-001</a></strong></td>
<td><a href="reference/multicol-margin-child-001-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>multi-column and margin collapsing of block children (basic)
<ul class="assert">
<li>This test checks that the margin-bottom of a block child in a multi-column element will collapse with the margin-top of a following block child of that same multi-colum element if those children are vertically adjacent and if no line boxes, no clearance, no padding and no border separate them.</li>
</ul>
</td>
</tr>
<tr id="multicol-nested-002-2" class="primary ahem">
<td><strong>
<a href="multicol-nested-002.xht">multicol-nested-002</a></strong></td>
<td><a href="reference/multicol-nested-002-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>multicolumn and margin-bottom collapsing
<ul class="assert">
<li>This test checks that a block container element's margin-bottom can collapse with its multi-column parent's margin-bottom if no line boxes, no clearance, no padding and no border separate them.</li>
</ul>
</td>
</tr>
<tr id="multicol-nested-margin-002-2" class="primary ahem">
<td><strong>
<a href="multicol-nested-margin-002.xht">multicol-nested-margin-002</a></strong></td>
<td><a href="reference/multicol-nested-margin-002-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>nested multicolumns and vertical margin (complex)
<ul class="assert">
<li>This test checks that when an inner nested multi-column element is preceded by a soft column break (caused by an unforced column-break), then the used margin-top of such inner nested multi-column element is '0'.</li>
</ul>
</td>
</tr>
<tr id="multicol-nested-margin-003-2" class="primary ahem">
<td><strong>
<a href="multicol-nested-margin-003.xht">multicol-nested-margin-003</a></strong></td>
<td><a href="reference/multicol-nested-margin-003-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>nested multicolumn and nested margin-top
<ul class="assert">
<li>This test checks that a top margin set on the first child element of a nested multicol element will not collapse with the margins of the multicol element.</li>
</ul>
</td>
</tr>
<tr id="multicol-nested-margin-004-2" class="primary ahem">
<td><strong>
<a href="multicol-nested-margin-004.xht">multicol-nested-margin-004</a></strong></td>
<td><a href="reference/multicol-nested-margin-004-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>nested multicolumn and nested margin-top
<ul class="assert">
<li>This test checks that due to a top margin only set on the first child element of a nested multicol element that will not collapse with the margins of the multicol element, then the height of an multi-column element can make its other inner multi-column (with a zero margin-top) element break into its own column boxes.</li>
</ul>
</td>
</tr>
<tr id="multicol-nested-margin-005-2" class="primary ahem">
<td><strong>
<a href="multicol-nested-margin-005.xht">multicol-nested-margin-005</a></strong></td>
<td><a href="reference/multicol-nested-margin-004-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>nested multicolumn and nested margin-top
<ul class="assert">
<li>This test checks that due to a top margin only set on the first child element of a nested multicol element that will not collapse with the margins of the multicol element, then the height of an multi-column element can make its other inner multi-column (with a zero margin-top) element break into its own column boxes.</li>
</ul>
</td>
</tr>
<tr id="multicol-table-cell-vertical-align-001-2" class="primary ahem">
<td><strong>
<a href="multicol-table-cell-vertical-align-001.xht">multicol-table-cell-vertical-align-001</a></strong></td>
<td><a href="reference/multicol-table-cell-vertical-align-ref.xht">=</a> </td>
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
<td>multicolumn | table-cell, vertical-align
</td>
</tr>
</tbody>
<tbody id="s2.#column-box">
<!-- 0 tests -->
</tbody>
<tbody id="s2.#multi-column-element">
<!-- 0 tests -->
</tbody>
</table>
</body>
</html>