Validación HTML: CSS: "margin-right": "px" no es un valor válido para "margin-right".

Acerca de este problema de CSS

Cuando escribes margin-right: px, el navegador no puede determinar qué margen aplicar porque px por sí solo no es un valor CSS reconocido — es solo un sufijo de unidad sin una cantidad. Los valores de longitud CSS siempre son una combinación de un número y una unidad (por ejemplo, 10px, 1.5em, 20%), o una palabra clave específica como auto, inherit, o 0 (que no requiere una unidad). El px solitario no tiene significado por sí mismo y será ignorado por los navegadores, lo que significa que tu espaciado previsto no se aplicará.

Este problema típicamente surge en algunos escenarios comunes:

Un número fue eliminado accidentalmente durante la edición, dejando solo la unidad.
Una variable de preprocesador CSS o expresión de plantilla falló al generar un valor, resultando en que solo se renderice la unidad.
Un error tipográfico o de copiar y pegar eliminó la parte numérica.

Más allá de simplemente no funcionar, el CSS inválido puede causar diferencias de renderizado impredecibles entre navegadores. También hace que tu código sea más difícil de mantener, ya que otros desarrolladores pueden no entender el valor previsto.

Para solucionarlo, determina qué valor numérico pretendías y colócalo directamente antes de la unidad px sin espacio entre el número y la unidad. Si no se necesita margen, elimina la propiedad completamente o establécela en 0.

Ejemplos

Incorrecto: unidad sin un número

<div style="margin-right: px;">Content</div>

El validador reporta que px no es un valor válido para margin-right porque ningún número precede a la unidad.

Solucionado: valor completo con número y unidad

<div style="margin-right: 10px;">Content</div>

Solucionado: usando cero (no se requiere unidad)

<div style="margin-right: 0;">Content</div>

Cuando el valor es 0, no se necesita unidad ya que cero es lo mismo en todas las unidades.

Solucionado: usando un valor de palabra clave

<div style="margin-right: auto;">Content</div>

La palabra clave auto es un valor válido para margin-right y se usa comúnmente para centrar o empujar elementos.

Ten cuidado con los problemas de preprocesadores o plantillas

Si estás usando un preprocesador CSS o un lenguaje de plantillas, asegúrate de que tus variables se resuelvan a valores completos:

/* Incorrecto — si $spacing está vacío, esto genera "margin-right: px;" */
.sidebar {
  margin-right: px;
}

/* Correcto */
.sidebar {
  margin-right: 16px;
}

Otras unidades válidas

Cualquier unidad de longitud CSS válida funciona, siempre que un número la preceda:

<div style="margin-right: 2em;">Margen basado en em</div>
<div style="margin-right: 5%;">Margen basado en porcentaje</div>
<div style="margin-right: 1.5rem;">Margen basado en rem</div>