1. Если родителем элемента table-cell не является элемент table-row, то между элементом table-cell и его родителем вставляется анонимный объект table-row. Введенный объект будет охватывать все последующие сестринские элементы элемента table-cell. Рассмотрим следующие стили и разметку:
system {display: table;}
name, moons {display: table-cell;}
<system>
<name>Mercury</name>
<moons>0</moons>
</system>
Анонимный объект table-row вставляется между элементами ячеек и элементом system и охватывает и элемент name, и элемент moons. То же правило действует, даже если родительским элементом является table-row-group. Чтобы расширить пример, добавим следующее:
system {display: table;}
planet {display: table-row-group;}
name, moons {display: table-cell;}
<system>
<planet>
<name>Mercury</name>
<moons>0</moons>
</planet>
<planet>
<name>Venus</name>
<moons>0</moons>
</planet>
</system>
В этом примере оба набора ячеек будут заключены в анонимный объект table-row, который вставляется между ними и элементами planet.
2. Если родителем элемента table-row не являются table, inline-table или table-row-group, то между элементом table-row и его родителем вставляется анонимный элемент table. Вставленный объект будет охватывать все последующие сестринские элементы элемента tab-le-row. Рассмотрим следующие стили и разметку:
docbody {display: block;}
planet {display: table-row;}
<docbody>
<planet>
<name>Mercury</name>
<moons>0</moons>
</planet>
<planet>
<name>Venus</name>
<moons>0</moons>
</planet>
</docbody>
Поскольку значение свойства display родителя элемента planet – block, анонимный объект table вставляется между элементами planet и элементом docbody. Этот объект будет охватывать оба элемента planet, потому что они являются последовательными сущностями.
3. Если родителем элемента table-column не является элемент table, inline-table или table-column-group, то между элементом table-column и его родителем вставляется анонимный элемент table. Это правило в основном аналогично только что рассмотренному с поправкой на его ориентированность на столбец.
4. Если родителем элемента table-row-group, table-header-group, table-footer-group, table column-group или table-caption не является элемент table, то между элементом и его родителем вставляется анонимный элемент table.
5. Если дочерним элементом элемента table или inline-table не является элемент table row-group, table-header-group, table-footer-group, table-row или table-caption, то анонимный элемент table-row вставляется между элементом table и его дочерним элементом. Этот анонимный объект охватывает все последующие сестринские элементы дочернего элемента, которые не являются элементами table-row-group, table-header-group, table-footer group, table-row или table-cap-tion. Рассмотрим следующие стили и разметку:
system {display: table;}
planet {display: table-row;}
name, moons {display: table-cell;}
<system>
<planet>
<name>Mercury</name>
<moons>0</moons>
</planet>
<name>Venus</name>
<moons>0</moons>
</system>
Здесь между элементом system и вторым набором элементов name и moons будет вставляться анонимный объект table-row. Элемент planet не охватывается анонимным объектом, потому что значением его свойства display является table-row.
6. Если дочерним элементом элементов table-row-group, table-header-group или table-foote-group не является элемент table-row, то анонимный объект table-row вставляется между элементом и его дочерним элементом. Этот анонимный объект охватывает все последующие сестринские элементы дочернего элемента, которые сами по себе не являются объектами table-row. Рассмотрим следующие стили и разметку:
system {display: table;}
planet {display: table-row-group;}
name, moons {display: table-cell;}
<system>
<planet>
<name>Mercury</name>
<moons>0</moons>
</planet>
<name>Venus</name>
<moons>0</moons>
</system>
В этом случае каждый набор элементов name и moons будет включен в анонимный элемент table-row. Для второго набора анонимный объект вставляется между элементом planet и его дочерним элементом, потому что элемент planet является элементом table-row-group.
7. Если дочерним элементом элемента table-row не является элемент table-cell, то анонимный объект table-cell вставляется между элементом и его потомком. Этот анонимный объект охватывает все последующие сестринские элементы дочернего элемента, которые сами по себе не являются элементами table-cell. Рассмотрим следующие разметку и стили:
system {display: table;}
planet {display: table-row;}
name, moons {display: table-cell;}
<system>
<planet>
<name>Mercury</name>
<num>0</num>
</planet>
</system>
Поскольку элемент num не имеет табличного значения свойства display, анонимный объект table-cell вставляется между элементом planet и элементом num. Это поведение также распространяется на инкапсуляцию анонимных строковых блоков. Предположим, что теперь не был включен и элемент num:
<system>
<planet>
<name>Mercury</name>
0
</planet>
</system>
В этом случае в анонимный объект table-cell был бы включен 0. Чтобы продолжить иллюстрацию этого момента, приведу пример, адаптированный из спецификации CSS:
example {display: table-cell;}
row {display: table-row;}
hi {font-weight: 900;}
<example>
<row>This is the <hi>top</hi> row.</row>
<row>This is the <hi>bottom</hi> row.</row>
</example>
В каждом элементе row фрагменты текста и элемент hi заключены в анонимный объект table-cell.