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

Initial Value

auto

Applies To

Tables and inline tables

Inherited?

No

Media

Visual

Example Code

table { 
  table-layout:fixed;
  }