Sobre este problema HTML
Em versões anteriores do HTML, o atributo align era usado diretamente em <td> (e outros elementos de tabela como <tr> e <th>) para controlar o alinhamento horizontal do conteúdo da célula. Valores como left, center, right e justify eram comuns. O HTML5 tornou este atributo obsoleto em favor do CSS, que oferece uma separação mais limpa entre conteúdo e apresentação.
Embora a maioria dos navegadores ainda honre o atributo align por compatibilidade com versões anteriores, depender dele é desencorajado. Viola os padrões modernos da web, mistura preocupações de apresentação no seu markup e torna a estilização mais difícil de manter. O CSS oferece muito mais flexibilidade — você pode segmentar células por classe, usar estilos responsivos ou alterar alinhamentos através de media queries sem tocar no seu HTML.
Como corrigir
-
Remova o atributo
aligndo elemento<td>. -
Aplique a propriedade CSS
text-alignem vez disso, seja através de um atributostyleinline, um bloco<style>ou uma folha de estilo externa.
A propriedade CSS text-align aceita os mesmos valores que o atributo antigo: left, center, right e justify.
Para alinhamento vertical, o atributo obsoleto valign deve igualmente ser substituído pela propriedade CSS vertical-align.
Exemplos
❌ Obsoleto: usando o atributo align
<table>
<tr>
<td align="center">Conteúdo centralizado</td>
<td align="right">Conteúdo alinhado à direita</td>
</tr>
</table>
✅ Corrigido: usando CSS inline
<table>
<tr>
<td style="text-align: center;">Conteúdo centralizado</td>
<td style="text-align: right;">Conteúdo alinhado à direita</td>
</tr>
</table>
✅ Corrigido: usando uma folha de estilo (recomendado)
Usar classes mantém o seu HTML limpo e torna fácil atualizar estilos em todo o seu site.
<style>
.text-center {
text-align: center;
}
.text-right {
text-align: right;
}
</style>
<table>
<tr>
<td class="text-center">Conteúdo centralizado</td>
<td class="text-right">Conteúdo alinhado à direita</td>
</tr>
</table>
✅ Corrigido: aplicando alinhamento a uma coluna inteira
Se cada célula numa coluna precisar do mesmo alinhamento, você pode segmentar células por posição em vez de adicionar uma classe a cada uma.
<style>
td:nth-child(2) {
text-align: right;
}
</style>
<table>
<tr>
<td>Item</td>
<td>$9.99</td>
</tr>
<tr>
<td>Outro item</td>
<td>$14.50</td>
</tr>
</table>
Esta mesma abordagem aplica-se aos elementos <th> e ao elemento <tr>, que também tinha um atributo align obsoleto no HTML mais antigo. Em todos os casos, substitua o atributo pela propriedade CSS text-align.
Encontre problemas como este automaticamente
O Rocket Validator analisa milhares de páginas em segundos, detetando problemas HTML em todo o seu site.