Propriedade Table Layout
Última atualização: 2026-09-13
table-layout Propriedade Table Layout
table-layout determina o algoritmo usado para calcular a largura das colunas da tabela. O padrão auto dimensiona colunas com base no conteúdo, então as colunas se alargam para caber muito conteúdo. fixed dimensiona colunas pela primeira linha ou por larguras explícitas, ignorando o conteúdo, e renderiza mais rápido — boa para tabelas de grandes volumes de dados.
| Categoria | |
|---|---|
| Valor Inicial | auto |
| Herdado | Não |
| Aplica-se A | |
| Tipo de Animação | |
| Versão CSS | CSS2 |
| Status | Padrão |
📝 Sintaxe
table-layout: auto | fixed;⚙️ Valores
| Valor | Tipo | Descrição |
|---|---|---|
auto | fixed | Palavra-chave | Algoritmo de layout de tabela |
▶ Exemplo
Edite o código abaixo e veja o resultado ao vivo no playground:
🌐 Suporte dos Navegadores
| Navegador |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| table-layout | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Suportado em todos os principais navegadores | |||||
Dica： table-layout: fixed com width: 100% e width definido no th da primeira linha produz rapidamente colunas iguais ou distribuídas proporcionalmente.
❓ Perguntas Frequentes
QQual é a diferença entre table-layout: auto e fixed?
Aauto (o padrão): o navegador percorre cada célula e calcula a largura das colunas a partir do conteúdo, então conteúdo largo estica colunas e pode até quebrar o contêiner, e a primeira renderização é mais lenta. fixed: a largura vem da primeira linha ou de larguras explícitas e ignora o conteúdo, renderizando mais rápido; o conteúdo transbordante pode ser tratado com overflow ou text-overflow.
QQuando devo usar table-layout: fixed?
AUse fixed para grandes conjuntos de dados, para larguras de coluna fixas ou quando precisar de truncamento de texto com text-overflow: ellipsis. Ele deixa a primeira linha determinar as larguras, renderiza mais rápido e o conteúdo longo não estoura a tabela. Tabelas responsivas também usam comum fixed com larguras em porcentagem para colunas distribuídas uniformemente.
QPor que minhas configurações de width não se aplicam com table-layout: fixed?
ANo modo fixed, as larguras vêm da primeira linha da tabela (geralmente th); larguras definidas em td em linhas seguintes são ignoradas. Para controlar larguras, defina-as no th da primeira linha ou use <colgroup> com <col>. Se a primeira linha não define larguras, as colunas são divididas igualmente pela largura total da tabela. Essa é a maior diferença de comportamento em relação a auto.
Qtable-layout: fixed pode resolver o conteúdo transbordando a tabela?
ASim. No modo auto, conteúdo longo estica colunas e pode quebrar o contêiner; no modo fixed, as larguras vêm da primeira linha, e o conteúdo transbordante quebra linha por padrão ou transborda. Combinado com white-space: nowrap, overflow: hidden e text-overflow: ellipsis, você obtém truncamento de linha única com reticências — o combo padrão para texto muito longo e transbordamento de tabela.
🏷️ Propriedades Relacionadas
💡 Casos relacionados
📚 Tutoriais Relacionados
Propriedade border-collapse
Controla como as bordas da tabela colapsam
Tutorial de Tabelas CSS
Domine técnicas de layout de tabela
