Lists and Tables - The CSS - page 182

table-layout
To maintain the integrity of the grid of cells, the content contained in
each cell has traditionally had some impact on the height of rows and
width of columns in a table, with the browser free to make adjust-
ments to provided dimensions. Even when a cell width is provided,
a large amount of text or a large image may make the cell larger. The
table-layout property allows for changing the method browsers use
to size and render a table.
■ auto : The width of the table and table cells is established and adjusted
as the content of each cell in the table is rendered, with the dimen-
sions provided by the CSS properties and adjusted for size or amount
of content (default).
■ fixed : The width of the table and the table cells do not rely on the
content but is determined only by the width of the table and columns,
allowing a browser to start rendering the table immediately.
For small tables of data, table-layout:auto may be fine, allowing
column widths to flex a bit to account for an unexpectedly large number.
For much larger tables where you'd want the content to start displaying
immediately or for cases where the integrity and uniformity of the cell
grid is important, you should use fixed .
border-collapse
■ separate : The borders of individual table cells are drawn as distinct
features and separated by some border padding. No other parts of
a table have borders (default).
■ collapse : The borders of the table and all parts of a table share the
same border on each side.