Skip to main content
Validação HTML

CSS: “margin”: “”X”” não é um valor “margin”.

Sobre este problema de CSS

Em CSS, valores de propriedades como comprimentos, percentagens e palavras-chave são escritos sem aspas. As aspas em CSS são reservadas para contextos específicos como strings da propriedade content, nomes de famílias de fontes com espaços e caminhos url(). Quando envolve um valor margin (ou qualquer valor de propriedade CSS similar) em aspas duplas ou simples, o analisador CSS interpreta-o como uma string literal em vez de um conjunto de valores de comprimento ou palavra-chave. Como "0 0 1em 0" é uma string e não um valor margin válido, a declaração é ignorada pelos navegadores e sinalizada pelo validador W3C.

Isto é um problema por várias razões. Primeiro, o estilo falhará silenciosamente — os navegadores descartam declarações CSS que não conseguem analisar, por isso as suas margens pretendidas não serão aplicadas, potencialmente quebrando o seu layout. Segundo, indica uma incompreensão da sintaxe CSS que pode levar a erros similares noutras propriedades. Este erro ocorre comummente quando os programadores confundem as regras de aspas de atributos HTML com a sintaxe de valores CSS, especialmente ao escrever atributos style inline onde o próprio valor do atributo já está entre aspas.

A propriedade margin aceita de um a quatro valores, cada um dos quais pode ser um comprimento (ex., 10px, 1em), uma percentagem, auto, ou uma palavra-chave global como inherit. Nenhum destes requer aspas. A correção é simples: remova as aspas à volta do valor CSS.

Exemplos

❌ Incorreto: valor margin envolvido em aspas

Num bloco <style>:

<style>
  .card {
    margin: "0 0 1em 0";
  }
</style>

Num estilo inline:

<p style="margin: '10px auto'">Hello</p>

Ambos produzem o erro do validador porque o analisador CSS vê uma string entre aspas em vez de valores margin válidos.

✅ Correto: valor margin sem aspas

Num bloco <style>:

<style>
  .card {
    margin: 0 0 1em 0;
  }
</style>

Num estilo inline:

<p style="margin: 10px auto">Hello</p>

Formatos válidos de valores margin

Para referência, aqui estão os padrões aceites para a propriedade margin — nenhum dos quais usa aspas:

/* Todos os quatro lados */
margin: 1em;

/* Vertical | Horizontal */
margin: 5% auto;

/* Topo | Horizontal | Fundo */
margin: 1em auto 2em;

/* Topo | Direita | Fundo | Esquerda */
margin: 2px 1em 0 auto;

/* Palavras-chave globais */
margin: inherit;
margin: initial;
margin: unset;

Cuidado com a confusão de aspas em estilos inline

Uma fonte comum deste erro é a confusão sobre as aspas usadas para o atributo HTML style versus os valores CSS dentro dele. As aspas externas delimitam o valor do atributo para HTML — o CSS no interior não deve ter as suas próprias aspas à volta dos valores das propriedades:

<!-- ❌ Errado: aspas extra à volta do valor CSS -->

<div style="margin: '1em'"></div>

<!-- ✅ Correto: apenas o atributo HTML tem aspas -->

<div style="margin: 1em"></div>

Esta mesma regra aplica-se a outras propriedades CSS como padding, border, font-size, color, e assim por diante. Se vir um erro similar do validador para qualquer propriedade CSS, verifique se acidentalmente colocou o valor entre aspas.

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.