col, display in browser
Browser display, col element
- col element is a void element (has no content): nothing to display in browser
- like most of the HTML elements, can be styled through CSS: the style depends on the CSS rule(s) applied
Video demonstration col element, view in browser
HTML5 col, browser display, Tutorial
| min | video details |
|---|---|
| 00:05 | testing the browser display of the col element (with CSS also) |
| 00:11 | the table has no col element inside colgroup element BUT by default, colgroup contains 1 column → an empty colgroup element = a colgroup with 1 col element |
| 00:17 | does not display in browser |
| 00:25 | col element does not display in browser |
| 00:35 | let's apply a CSS rule on col element: a 6px border |
| 00:43 | the 2 col elements = 2 columns are now highlighted and visible through CSS |
| 00:51 | 1 column (col) inside colgroup + a 6px border displays in browser like this |
| 00:53 | 3 columns (col) inside colgroup + a 6px border on each, display in browser like this |
| 01:01 | 4 columns (col) inside colgroup + a 6px border on each, display in browser like this |