The display
property, which specifies how the element should be shown in the document.
display: inline | block | inline-block | list-item | run-in | compact | table | inline-table | table-row-group | table-header-group | table-footer-group | table-row | table-column-group | table-column | table-cell | table-caption | ruby | ruby-base | ruby-text | ruby-base-group | ruby-text-group | none;
There are two ways to use tables in layout: this is an HTML table and a CSS table.
An HTML table is when a native HTML <table>
tag is used to create a table, and a CSS table is an imitation of the same behavior but with CSS properties.
The display: table
CSS property and others render a group of elements like a <table>
table, but with the limitation that colspan
and rowspan
cell joins are not supported.
List of properties and tags they replace:
display: table; |
<table> |
display: inline-table; |
<table> but also display: inline-block |
display: table-caption; |
<caption> |
display: table-column-group; |
<colgroup> |
display: table-column; |
<col> |
display: table-header-group; |
<thead> |
display: table-row-group; |
<tbody> |
display: table-footer-group; |
<tfoot> |
display: table-row; |
<tr> |
display: table-cell; |
<td> or <th> |