A propriedade CSS table-layout

Definição e uso

A propriedade tableLayout é usada para exibir as regras do algoritmo de exibição das células, linhas e colunas da tabela.

Layout fixo da tabela:

Em comparação com o layout automático da tabela, o layout fixo da tabela permite que o navegador faça o layout da tabela mais rapidamente.

No layout fixo da tabela, o layout horizontal depende apenas da largura da tabela, da largura das colunas, da largura da borda da tabela e do espaçamento das células, e não do conteúdo das células.

Ao usar o layout fixo da tabela, o agente de usuário pode exibir a tabela assim que receber a primeira linha.

Layout automático da tabela:

No layout automático da tabela, a largura da coluna é determinada pelo conteúdo mais largo da célula da coluna que não tem quebra de linha.

Este algoritmo pode ser mais lento, pois precisa acessar todo o conteúdo da tabela antes de determinar o layout final.

Explicação

Esta propriedade especifica o algoritmo de layout usado para completar o layout da tabela. O algoritmo de layout fixo é mais rápido, mas menos flexível, enquanto o algoritmo automático é mais lento, mas reflete melhor a tabela tradicional do HTML.

Veja também:

Tutorial de CSS:Tabela CSS

Manual de referência do HTML DOM:Propriedade tableLayout

Exemplo

Configurar o algoritmo de layout da tabela:

tabela
  {
  table-layout:fixed;
  }

Experimente você mesmo

Sintaxe do CSS

table-layout: auto|fixed|initial|inherit;

Valor da propriedade

Valor Descrição
automatic Padrão. A largura das colunas é determinada pelo conteúdo das células.
fixed A largura das colunas é determinada pela largura da tabela e pela largura das colunas.
inherit Deve-se herdar o valor da propriedade table-layout do elemento pai.

Detalhes técnicos

Valor padrão: auto
Herança: sim
Versão: CSS2
Sintaxe do JavaScript: objeto.style.tableLayout="fixed"

Mais exemplos

Configurar o layout da tabela
Este exemplo demonstra como configurar o layout da tabela.

Suporte do navegador

Os números na tabela indicam a primeira versão do navegador que suporta completamente essa propriedade.

Chrome IE / Edge Firefox Safari Opera
14.0 5.0 1.0 1.0 7.0