|
+
3 The number and width of columns |
|---|
|
grid-inline-multicol-001 |
= |
|
'column-*' properties from inline grid container does not apply to grid items
- This test checks that 'column-*' properties in the Multicol module are ignored in grid items when applied to an inline grid container.
|
|
grid-multicol-001 |
= |
|
'column-*' properties from grid container does not apply to grid items
- This test checks that 'column-*' properties in the Multicol module are ignored in grid items when applied to a grid container.
|
|
multicol-columns-001 |
= |
Ahem |
columns shorthand (basic)
- This test checks that 'columns: 100px 6' shorthand correctly set 'column-width' and 'column-count' properties.
|
|
multicol-columns-002 |
= |
Ahem |
columns shorthand (basic)
- This test checks that 'columns: 6 100px' shorthand correctly set 'column-width' and 'column-count' properties.
|
|
multicol-columns-003 |
= |
Ahem |
columns shorthand (basic)
- This test checks that 'columns: 100px auto' shorthand correctly set 'column-width' and 'column-count' properties.
|
|
multicol-columns-004 |
= |
Ahem |
columns shorthand (basic)
- This test checks that 'columns: auto 100px' shorthand correctly set 'column-width' and 'column-count' properties.
|
|
multicol-columns-005 |
= |
Ahem |
columns shorthand (basic)
- This test checks that 'columns: 6' shorthand correctly set 'column-width' and 'column-count' properties. 'columns: 6' is equivalent to 'column-width: auto' and 'column-count: 6'.
|
|
multicol-columns-006 |
= |
Ahem |
columns shorthand (basic)
- This test checks that 'columns: 6 auto' shorthand correctly set 'column-width' and 'column-count' properties.
|
|
multicol-columns-007 |
= |
Ahem |
columns shorthand (basic)
- This test checks that 'columns: auto 6' shorthand correctly set 'column-width' and 'column-count' properties.
|
|
multicol-columns-invalid-001 |
= |
AhemInvalid |
invalid columns shorthand
- This test checks that 'columns: 8 normal' is invalid (generating a parsing error) and therefore will be ignored.
|
|
multicol-columns-invalid-002 |
= |
AhemInvalid |
invalid columns shorthand
- This test checks that 'columns: 8 auto 6em' is invalid (generating a parsing error) and therefore will be ignored.
|
|
multicol-columns-toolong-001 |
= |
Ahem |
narrower inline content inside wider colum box
- This test checks the rendering of inline content (2em) inside wider (3em) column boxes.
|
|
multicol-count-computed-001 |
= |
Ahem |
multicolumn | column-rule
|
|
multicol-count-computed-002 |
= |
Ahem |
multicolumn | column-rule
|
|
multicol-count-computed-003 |
= |
Ahem |
column-rule and overflow inside (complex test)
- This test checks that if one of 2 adjacent column boxes (2nd and 3rd colum box in this test) does not have any content, then the column rule separating those should not be drawn. In this test, the 3rd colum box should have no inline content. This test also checks that inline content in the normal flow that extends into a column gap should be clipped in the middle of the column gap. So, in this test, inline content in 1st column box should be partially clipped and overlapped partially by 1st column-rule.
|
|
multicol-count-computed-005 |
= |
Ahem |
column-rule and overflow inside (complex test)
- This test checks that if one of 2 adjacent column boxes (2nd and 3rd colum box in this test) does not have any content, then the column rule separating those should not be drawn. In this test, the 3rd colum box should have no inline content. This test also checks that inline content in the normal flow that extends into a column gap should be clipped in the middle of the column gap. So, in this test, inline content in 1st column box should be partially clipped and overlapped partially by 1st column-rule.
|
|
multicol-count-large-001 |
= |
Ahem |
multicolumn | column-count
|
|
multicol-count-large-002 |
= |
Ahem |
multicolumn | column-count
|
|
multicol-count-negative-001 |
= |
AhemInvalid |
negative 'column-count' value
- This test checks that a specified negative 'column-count' value is invalid and ignored.
|
|
multicol-count-negative-002 |
= |
AhemInvalid |
zero 'column-count' value
- This test checks that a specified 0 'column-count' value is invalid and ignored.
|
|
multicol-count-non-integer-001 |
= |
AhemInvalid |
non-integer 'column-count' value
- This test checks that a specified real 'column-count' value is invalid and ignored.
|
|
multicol-count-non-integer-002 |
= |
AhemInvalid |
non-integer 'column-count' value
- This test checks that a specified real 'column-count' value is invalid and ignored.
|
|
multicol-count-non-integer-003 |
= |
AhemInvalid |
non-integer 'column-count' value
- This test checks that a specified real 'column-count' value is invalid and ignored.
|
|
multicol-inherit-003 |
= |
Ahem |
multicolumn | inheritance
|
|
multicol-shorthand-001 |
= |
AhemInvalid |
multicolumn | invalid
|
|
multicol-table-cell-001 |
= |
Ahem |
column-count and table-cell (basic)
- This test checks that 'column-count' applies to elements with 'display' set to 'table-cell'.
|
|
multicol-table-cell-height-001 |
= |
Ahem |
column-count and height of table-cell (basic)
- This test checks that 'column-count' applies to elements with 'display' set to 'table-cell' which can be constrained with a set height.
|
|
multicol-table-cell-height-002 |
= |
Ahem |
column-count and height of table-cell (basic)
- This test checks that 'column-count' applies to elements with 'display' set to 'table-cell' which can be constrained with a set height. A set height for a table-cell still remains the minimum height required by the content, even when its layout is influenced by, conditioned by a multi-column layout.
|
|
multicol-width-001 |
= |
Ahem |
column-width (basic)
|
|
multicol-width-002 |
= |
Ahem |
column-width (basic)
|
|
multicol-width-003 |
= |
Ahem |
column-width (basic)
|
|
multicol-width-count-001 |
= |
Ahem |
column-count and column-width (basic)
|
|
multicol-width-ems-001 |
= |
|
multicolumn | column-width
|
|
+
3.1 ‘column-width’ |
|---|
|
multicol-reduce-000 |
= |
Ahem |
column width becomes wider to fill available space
- This test checks that column width is increased to fill the available space: in this test, there are only 2 column boxes.
|
|
multicol-width-invalid-001 |
= |
AhemInvalid |
invalid column-width
- This test checks that 'column-width: bzzt' is invalid (generating a parsing error) and therefore will be ignored.
|
|
multicol-width-large-001 |
= |
Ahem |
large column-width
- This test checks that a set 'column-width' may be wider (to fill the available space). In this test, the actual column-width will be increased to 12em.
|
|
multicol-width-large-002 |
= |
Ahem |
large column-width
- This test checks that a set 'column-width' equal in width to the whole available space of the multi-column will use it all for its column box.
|
|
multicol-width-negative-001 |
= |
AhemInvalid |
negative column-width
- This test checks that a set 'column-width' can not be negative.
|
|
multicol-width-small-001 |
= |
Ahem |
narrow column-width
- This test checks that a set 'column-width' which is small with regards to width of multi-column element. In this test, in-flow content that extends into column gaps is clipped in the middle of the column gap.
|
|
multicol-zero-height-001 |
= |
|
multi-column element with zero height
|
|
+
3.3 ‘columns’ |
|---|
|
multicol-basic-001 |
= |
Ahem |
Multi-column element via columns: [integer]
|
|
multicol-basic-002 |
= |
Ahem |
Multi-column element via column-count: [integer]
|
|
multicol-basic-003 |
= |
Ahem |
Multi-column element via columns: [width]
|
|
multicol-basic-004 |
= |
Ahem |
Multi-column element via column-width: [width]
|
|
regions-multicol-003 |
= |
Ahem |
One named flow multi-column container, text content overflowing one region
- This test checks that text content flows through a region maintaining the named flow multi-column container and that it overflows visibly into a third column.
|
|
regions-multicol-004 |
= |
Ahem |
One named flow, text content flowing into one multi-column region
- This test checks that text content in a named flow is laid out using columns when flowed in a multi-column region.
|
|
regions-multicol-006 |
= |
Ahem |
One named flow, text content - fragmented between multicol region and non-multicol region
- This test checks that the named flow text content flows through the multi-column region in the region chain then through the second non-multicol region in the chain.
|
|
regions-multicol-008 |
= |
|
One named flow, non-text fragmentable content flowing into multi-column region then into non-multicol region
- This test checks that non-text named flow contentmulti-column is fragmented first through the columns in a region multi-column container, then through a second non-multi-column region.
|
|
regions-multicol-009 |
= |
|
One named flow, text content flowing into a simple region then into a multi-column region
- This test checks that text named flow content is fragmented first through a simple region, then through a multi-column region
|
|
regions-multicol-011 |
= |
|
One named flow, non-text fragmentable content flowing into non-mulicol region then into a multi-column region
- This test checks that non-text fragmentable named flow content is fragmented through a simple region, then through a multi-column region.
|
|
regions-multicol-012 |
= |
|
One named flow multi-column container, monolithic content flowing into one region
- This test checks that monolithic content in a named flow multi-column container flows through the region.
|
|
regions-multicol-013 |
= |
Ahem |
One named flow, text content flowing into multiple regions fragmented across multiple columns and overflowing the last region
- This test checks that the named flow text content flows through the regions in the multi-column container and that it overflows visibly into a fourth column.
|
|
regions-multicol-015 |
= |
Ahem |
One named flow muticolumn container, text content flowing into multiple regions with content overflowing last region
- This test checks that text content flows through multiple regions from the named flow multi-column container and that it overflows the last region in the region chain visibly.
|
|
regions-multicol-016 |
= |
|
One named flow multi-column container, monolithic content flowing into multiple regions
- This test checks that monolithic content flows through multiple regions from the named flow multi-column container and that it overflows the last region in the region chain visibly into a fifth column.
|
|
regions-multicol-017 |
= |
Ahem |
Multiple named flows, text content flowing into multiple regions in a multi-column container
- This test checks multiple named flows with text content flow into multiple regions in the multi-column container.
|
|
regions-multicol-019 |
= |
Ahem |
Multiple named flows multi-column containers, text content flowing into multiple visually overlapping regions
- This test checks multiple named flow multi-column containers with text content flow into multiple overlapping regions.
|
|
regions-multicol-021 |
= |
|
Multiple named flows multi-column containers with unspecified width, non-text content flowing into multiple overlapping regions
- This test checks multiple named flow multi-column containers with unspecified width and non-text content flow into multiple overlapping regions.
|
|
regions-multicol-022 |
= |
Ahem |
One named flow multi-column container, text content flowing into one autosized region with overflowing column
- This test checks that text content flows through an autosized region from a multi-column named flow and that it overflows visibly into a third column.
|
|
regions-multicol-023 |
= |
|
One named flow multi-column container, monolithic content flowing into an autosized region, overflowing column
- This test checks that text content flows through an autosized region from the multi-column named flow and that it overflows visibly into a third column.
|
|
regions-multicol-024 |
= |
Ahem |
One named flow multi-column container with text content flowing into region of smaller width/height than the second region
- This test checks that text content flows through a region with a smaller width + height than the multi-column named flow and than the second region and that it overflows the first region visibly as a multi-column container before flowing into the second region.
|
|
regions-multicol-025 |
= |
|
One named flow multi-column container with monolithic content flowing into region of smaller width/height than the second region
- This test checks that text content flows through a region with a smaller width + height than the multi-column named flow and the second region and that it overflows the first region visibly as a multi-column container before flowing into the second region.
|
|
regions-multicol-026 |
= |
Ahem |
One named flow multi-column container with text content flowing into region of smaller height than the second region
- This test checks that text content flows through a region with a height smaller than the second region and that it overflows the first region as a multi-column container before flowing into the second region.
|
|
regions-multicol-027 |
= |
|
One named flow multi-column container with monolithic content + flowing into region of smaller height than the second region
- This test checks that monolithic content flows through a region with a height smaller than the second region and that it overflows the first region as a multi-column container before flowing into the second region.
|
|
regions-multicol-028 |
= |
Ahem |
One named flow multi-column container with text content flowing into first region of smaller width than the second region
- This test checks that text content flows through a region with a smaller width than the multi-column named flow and the second region and that it overflows the first region visibly as a multi-column container before flowing into the second region.
|
|
regions-multicol-029 |
= |
|
One named flow multi-column container with monolithic content flowing into first region of smaller width than the second region
- This test checks that monolithic content flows through a region with a smaller width than the multi-column named flow and the second region and that it overflows the first region visibly as a multi-column container before flowing into the second region.
|
|
+
3.4 Pseudo-algorithm |
|---|
|
multicol-count-computed-004 |
= |
Ahem |
both 'column-width' and 'column-count' are 'auto'
- This test checks that if 'column-width' is 'auto' and if 'column-count' is 'auto', then such element will not behave like a multi-column element and column-gap and column-rule declarations will be ignored.
|
|
multicol-inherit-001 |
= |
Ahem |
multicolumn and inheritance
|
|
multicol-list-item-001 |
= |
Ahem |
multi-column and list-item
- This test checks that an unordered list of list items can be set to display its list-items in column boxes.
|
|
multicol-margin-001 |
= |
Ahem |
multi-column and margin collapsing of first child (basic)
- This test checks that the margin-top of the first child of a multi-column element (with column-fill: auto) does not collapse with its parent.
|
|
multicol-margin-002 |
= |
Ahem |
multi-column and margin collapsing of first child (basic)
- This test checks that the margin-top of the first child (an inline-block) of a multi-column element (with column-fill: balance) does not collapse with its parent.
|
|
multicol-nested-005 |
= |
Ahem |
nested multi-columns and constrained dimensions
- This test checks how the height of column boxes conditions the height of nested column boxes.
|
|
multicol-nested-column-rule-001 |
= |
Ahem |
nested multi-columns and column-rule position
- This test checks how the height of column boxes conditions the height of column rule.
|