CSS: “padding”: “px” não é um valor “padding” válido.

A propriedade padding aceita um ou mais valores de comprimento, percentagens, ou a palavra-chave 0. Um valor de comprimento válido consiste sempre num número imediatamente seguido por um identificador de unidade, tal como 10px, 1.5em, ou 2rem. Escrever apenas px sem um número precedente não faz sentido para o parser CSS — é como dizer “pixels” sem especificar quantos. O browser descartará a declaração inválida completamente, o que significa que o elemento voltará ao seu padding padrão ou herdado, potencialmente quebrando o seu layout de formas inesperadas.

Este erro ocorre normalmente devido a:

• Erros de digitação ou eliminação acidental — a parte numérica do valor foi inadvertidamente removida durante a edição.
• Problemas de templating ou ferramentas de build — um valor dinâmico (por exemplo, de uma variável ou campo CMS) resolveu para uma string vazia, deixando apenas o sufixo px.
• Erros de cópia e colagem — copiar um snippet e esquecer de atualizar o valor placeholder.

Porque o validador W3C sinaliza isto em atributos style inline, significa que CSS inválido está incorporado diretamente no seu HTML. Corrigi-lo melhora a conformidade com os padrões e garante renderização consistente entre browsers.

Como corrigir

1. Adicione um valor numérico antes da unidade: altere px para algo como 10px, 1em, ou 5%.
2. Use 0 sem uma unidade se quiser padding zero — escrever padding: 0; é válido e preferido sobre padding: 0px;.
3. Verifique valores dinâmicos — se o número vem de uma variável ou expressão de template, certifique-se que produz um número válido e não está vazio.

Exemplos

Incorreto: Unidade sem um número

<div style="padding: px;">Content</div>

O validador reporta que px não é um valor padding válido porque nenhum número precede a unidade.

Correto: Valor numérico com unidade

<div style="padding: 10px;">Content</div>

Correto: Padding zero (nenhuma unidade necessária)

<div style="padding: 0;">Content</div>

Quando o valor é 0, nenhuma unidade é necessária uma vez que zero pixels, zero ems, e zero por cento são todos idênticos.

Correto: Múltiplos valores de padding

<div style="padding: 8px 16px;">Content</div>

Isto define 8px de padding vertical e 16px de padding horizontal — ambos são valores de comprimento válidos.

Incorreto em CSS externo

O mesmo problema pode aparecer numa folha de estilos ligada do seu HTML:

.card {
  padding: px;
}

Corrigido em CSS externo

.card {
  padding: 12px;
}

Atenção a valores gerados por template

Se usar um sistema de templating, verifique duas vezes que a parte numérica realmente renderiza. Por exemplo, um template como este pode produzir o erro se spacing estiver vazio:

<!-- Se spacing estiver vazio, isto torna-se "padding: px;" -->

<div style="padding: {{ spacing }}px;">Content</div>

Certifique-se que a variável sempre resolve para um número válido, ou forneça um valor de fallback.

Encontre problemas como este automaticamente

O Rocket Validator analisa milhares de páginas em segundos, detetando problemas HTML em todo o seu site.

Iniciar teste gratuito Ver preços