CSS table-layout Property
Topic: CSS3 Properties ReferencePrev|Next
Description
The table-layout CSS property specifies the algorithm used to lay out the table cells, rows, and columns. The following table summarizes the usages context and the version history of this property.
| Default value: | auto |
|---|---|
| Applies to: | The table and inline-table elements |
| Inherited: | No |
| Animatable: | No. See animatable properties. |
| Version: | CSS 2, 3 |
Syntax
The syntax of the property is given with:
The example below shows the table-layout property in action.
Example
Try this code »table {
width: 250px;
table-layout: fixed;
}Tip: The fixed table layout algorithm allows a browser to lay out the table faster than the automatic table layout algorithm. The browser can begin to display the table once the first row has been received.
Property Values
The following table describes the values of this property.
| Value | Description |
|---|---|
auto |
An automatic table layout algorithm is used for table layout. The width of the table and its cells depends on the content of the cell. This is default value. |
fixed |
Fixed table layout algorithm is used for table layout.
|
initial |
Sets this property to its default value. |
inherit |
If specified, the associated element takes the computed value of its parent element table-layout property. |
Note: The automatic table layout algorithm can slow down the rendering of a table having the large number of rows or columns, since it requires the browser to have access to all the content in a table before determining the final layout.
Browser Compatibility
The table-layout property is supported in all major modern browsers.
 |
Basic Support—
|
Further Reading
See tutorial on: HTML Tables, CSS Tables.
Related properties: width.
