HTML and CSS Reference
In-Depth Information
empty-cells
A table cell without any content normally still displays its border and background. This
behavior can be changed with the
empty-cells
property.
empty-cells : inherit | show | hide
Setting the value for this property to
hide
causes the cell's border and background to
be hidden. The layout of the table is not affected.
table-layout
The
table-layout
property determines whether the width of table cells should be fixed
or flexible. Unlike the other table properties,
table-layout
is not inherited.
table-layout : auto | fixed
This property is initially set to
auto
, which means that the width of table cells
automatically expands to fit their content, even if that means going beyond their set
width. To enforce a table's specified width, the
table-layout
can instead be set to
fixed
.
The horizontal layout then depends only on the table's set width, not on the content of
the cells.
/* Enforce table width */
.fixed { table-layout: fixed; }
A fixed table layout has the added benefit that the browser can render the table more
quickly because it knows the dimension of the table as soon as the first row is received.
