Sobre este problema HTML
A especificação HTML define um modelo de conteúdo estrito para tabelas. O elemento <td> (dados da tabela) representa uma única célula contendo dados, e só pode aparecer como filho de um elemento <tr>. Elementos de seccionamento de tabela como <tbody>, <thead> e <tfoot> só podem conter elementos <tr> como filhos diretos — não células <td> ou <th> diretamente. Quando o validador encontra uma etiqueta de abertura <td> dentro de um corpo de tabela (ou outra secção) sem um <tr> envolvente, reporta este erro.
Esta questão surge tipicamente em alguns cenários comuns:
-
Um wrapper
<tr>em falta — o programador colocou células diretamente dentro de<tbody>ou<table>sem criar uma linha. -
Um
<tr>fechado prematuramente — um erro tipográfico ou etiqueta</tr>perdida terminou a linha demasiado cedo, deixando elementos<td>subsequentes órfãos. -
HTML gerado dinamicamente — motores de template ou JavaScript podem produzir markup de tabela onde elementos
<tr>são acidentalmente omitidos.
Por que isto importa
-
Conformidade com normas: O padrão HTML em vigor exige explicitamente que elementos
<td>sejam filhos de<tr>. Violar isto produz markup inválido. -
Inconsistência do browser: Os browsers tentarão corrigir o erro criando implicitamente elementos
<tr>, mas diferentes browsers podem interpretar a estrutura malformada de forma diferente, levando a renderização imprevisível. -
Acessibilidade: Leitores de ecrã e tecnologias assistivas dependem da estrutura correta da tabela para navegar linhas e colunas. Elementos
<tr>em falta podem confundir estas ferramentas, tornando os dados mais difíceis ou impossíveis de compreender para utilizadores que dependem delas. - Manutenibilidade: Markup de tabela inválido é mais difícil de estilizar com CSS e mais difícil para outros programadores compreenderem e manterem.
Exemplos
Incorreto — <td> diretamente dentro de <tbody>
Os elementos <td> são filhos de <tbody> em vez de estarem envolvidos num <tr>:
<table>
<tbody>
<td>Name</td>
<td>Age</td>
</tbody>
</table>
Correto — <td> envolvido em <tr>
Adicionar um elemento <tr> cria uma linha de tabela válida:
<table>
<tbody>
<tr>
<td>Name</td>
<td>Age</td>
</tr>
</tbody>
</table>
Incorreto — <tr> fechado prematuramente deixa células órfãs
Aqui o primeiro </tr> fecha a linha demasiado cedo, então o segundo <td> acaba diretamente dentro de <tbody>:
<table>
<tbody>
<tr>
<td>Cell 1</td>
</tr>
<td>Cell 2</td>
<td>Cell 3</td>
</tbody>
</table>
Correto — todas as células colocadas dentro de linhas adequadas
Inclua todas as células numa linha, ou crie múltiplas linhas conforme necessário:
<table>
<tbody>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
</tr>
</tbody>
</table>
Ou, se pretendia duas linhas separadas:
<table>
<tbody>
<tr>
<td>Cell 1</td>
</tr>
<tr>
<td>Cell 2</td>
<td>Cell 3</td>
</tr>
</tbody>
</table>
Incorreto — <td> diretamente dentro de <table> sem secções ou linhas
<table>
<td>Alpha</td>
<td>Beta</td>
</table>
Correto — estrutura de tabela válida mínima
Embora <tbody> seja opcional (os browsers adicionam-no implicitamente), um <tr> é sempre necessário:
<table>
<tr>
<td>Alpha</td>
<td>Beta</td>
</tr>
</table>
Para corrigir este erro, inspecione o seu markup de tabela e certifique-se de que cada elemento <td> (e <th>) é filho direto de um <tr>. Verifique etiquetas de fecho </tr> perdidas que possam terminar linhas prematuramente, e confirme que qualquer conteúdo de tabela gerado dinamicamente produz wrappers <tr> em torno de elementos de célula.
Encontre problemas como este automaticamente
O Rocket Validator analisa milhares de páginas em segundos, detetando problemas HTML em todo o seu site.