colgroup nested within elements, elements nested within colgroup
Classified as: -
Parents, colgroup
Children, colgroup
Examples: colgroup parents, colgroup children
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <!doctype html> <> <> <>...</> </> <> <> <>...</> < span="2"> <> <> <> </> </> </> |
| 1 2 3 4 5 6 7 8 9 10 11 12 13 | <!doctype html> <> <> <>...</> </> <> <> <> <></></> </> </> </> |
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | <!doctype html> <> <> <>...</> <> ... </> <> <> ... <> <> <> </> </> </> |
Syntax 1: Valid, colgroup nested within table as its second child (caption, first child) and before thead, tfoot, tbody, tr: allowed
span attribute present → no element can be nested within colgroup
Syntax 2: Valid, span attribute absent → col elements nested within colgroup: allowed
Syntax 3: Invalid, colgroup element(s) nested within different elements (head, body, p) other than table: not allowed;
img nested within colgroup: not allowed elements other than col and col allowed only if span attribute absent
Video demonstration nesting colgroup
HTML5 nesting colgroup Tutorial
| min | video details |
|---|---|
| 00:05 | video tutorial: colgroup nested inside elements; elements nested inside colgroup |
| 00:13 | colgroup element canbe nested only inside table element; as its second child; after caption and before thead, tfoot, tbody ⁄tr; |
| 00:29 | nesting colgroup inside table |
| 00:35 | the only element that can be nested inside colgroup is col element |
| 00:43 | note: span attribute on colgroup is absent |
| 00:48 | when both span attribute and col element are present on ⁄inside colgroup element → span attribute is ignored |
| 00:55 | if you want to span columns in a colgroup, do not nest col element inside colgroup |
| 01:02 | when span attribute is absent, col element can be present inside colgroup |