Skip to main content
Validação HTML

CSS: “X”: A propriedade “X” não existe.

Sobre este problema de CSS

O validador sinaliza qualquer declaração onde o token da propriedade não corresponde a uma propriedade CSS conhecida no seu conjunto de regras. As causas comuns incluem erros tipográficos, hifenização incorreta, usar valores onde deveriam estar nomes de propriedades, propriedades de rascunhos antigos que foram renomeadas, ou depender apenas de propriedades com prefixo de fornecedor/experimentais sem um equivalente padrão. Também pode aparecer quando se copia e cola fragmentos que incluem propriedades personalizadas não padronizadas.

Porque isto é importante:

  • Compatibilidade com browsers: Propriedades desconhecidas são ignoradas, fazendo com que os estilos falhem silenciosamente.
  • Manutenibilidade: Erros tipográficos e sintaxe não padrão tornam o CSS mais difícil de depurar.
  • Conformidade com padrões: CSS limpo e validado reduz surpresas entre browsers e facilita a manutenção futura.

Como corrigir:

  1. Verifique a ortografia e hifenização exatamente (por exemplo, text-decoration-skip-ink, não text-decoration-skipink).
  2. Verifique se a propriedade existe no MDN ou nas especificações CSS; se não estiver documentada, provavelmente é inválida.
  3. Substitua nomes obsoletos ou de rascunho pelos atuais padronizados.
  4. Se usar funcionalidades experimentais, inclua um fallback padrão e mantenha versões com prefixo de fornecedor junto com a propriedade sem prefixo quando suportada.
  5. Remova tokens específicos de framework ou ferramentas que não são CSS válido em tempo de execução.
  6. Não invente propriedades. Se precisar de dados personalizados para JS, use atributos data-* no HTML, não propriedades CSS falsas.

Exemplos

Exemplo que desencadeia o erro (erro tipográfico) e a versão corrigida

Inválido:

<p style="colr: red;">Olá</p>

Válido:

<p style="color: red;">Olá</p>

Exemplo usando um nome obsoleto/rascunho substituído pela propriedade atual

Inválido (nome de rascunho antigo):

<div style="gap: 1rem; grid-row-gap: 8px;"></div>

Válido (propriedade atual padronizada):

<div style="row-gap: 8px; gap: 1rem;"></div>

Exemplo com propriedade com prefixo de fornecedor mais fallback padrão

Inválido (apenas com prefixo de fornecedor, falta propriedade padrão):

<div style="-webkit-user-select: none;"></div>

Válido (fallback mais prefixo):

<div style="user-select: none; -webkit-user-select: none;"></div>

Exemplo removendo um uso incorreto de nome de propriedade personalizada não padrão

Inválido (tentativa de inventar uma propriedade):

<div style="button-style: primary;"></div>

Válido (use classes e propriedades CSS reais):

<style>
  .btn--primary {
    background-color: #0b5fff;
    color: #fff;
  }
</style>
<button class="btn--primary">Enviar</button>

Exemplo com propriedades personalizadas (variáveis) usadas corretamente

Uso válido de propriedades personalizadas CSS (não desencadeará o erro porque a propriedade é padrão e propriedades personalizadas começam com --):

<style>
  :root {
    --brand-color: #0b5fff;
  }
  .tag {
    color: var(--brand-color);
  }
</style>
<span class="tag">Tag</span>

Documento completo com propriedades corrigidas

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Correções de Validação de Propriedades CSS</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
      .card {
        display: grid;
        gap: 1rem;
        row-gap: 0.5rem;
        user-select: none;
        -webkit-user-select: none;
        color: #222;
      }
    </style>
  </head>
  <body>
    <div class="card">Propriedades CSS válidas em uso</div>
  </body>
</html>

Lista de verificação rápida:

  • Confirme a propriedade no MDN. Se não for encontrada, provavelmente é inválida.
  • Corrija ortografia/maiúsculas; propriedades CSS são minúsculas com hífens.
  • Prefira nomes padronizados; mantenha prefixos apenas como suplementos.
  • Use propriedades personalizadas CSS começando com -- se precisar de variáveis.
  • Remova marcadores específicos de ferramentas antes da validação.

Encontre problemas como este automaticamente

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

Ajude-nos a melhorar os nossos guias

Este guia foi útil?

Pronto para validar os seus sites?
Comece o seu teste gratuito hoje.