CSS table-layout

The CSS table-layout property allows you to fix the table layout so that the table renders much faster.

Without this property, on large tables, users won't see any part of the table until the browser has rendered the whole table. This can give the impression that your page loads very slowly. On the other hand, if you use the table-layout property, users will see the top of the table while the browser loads and renders rest of the table. This gives the impression that the page loads a lot quicker.

Syntax

table-layout: <border-style1>, <border-style2> ...

Possible Values

  • auto
  • fixed
  • inherit

Specifications

Initial Value
auto
Applies To
Tables and inline tables
Inherited?
No
Media
Visual

Example Code

table { 
  table-layout:fixed;
  }