Browser render a table according the value of the
table-layout property.
The possible values are
| Properties | Values |
|---|
auto | (default) First the table data is read, then the row and cell data is complete rendered using the minimum necessary space. |
fixed | First, the table rows and cells are rendered using the specified values for width and height, then the table data is rendered using the existing space. |
snippet
<html>
<head>
<style>
*{border: 1px solid gray;}
table.col1{table-layout:auto;}
table.col2{table-layout:fixed;}
table td{width:50px;}
table tr{height:50px;}
</style>
</head>
<body>
<table class="col1">
<tr><td>data 1<td>data 2<td>data 3
<tr><td>data 4<td>data 5<td>data 6
</table>
<table class="col2">
<tr><td>data 1<td>data 2<td>data 3
<tr><td>data 4<td>data 5<td>data 6
</table>
</body>
</html>
