Info Regla con cuerpo vacío

Un selector con llave de apertura y cierre pero sin declaraciones dentro — generalmente sobrante de una refactorización o una edición a medio hacer.

El validador marca una regla cuyo selector va seguido de { } sin ninguna declaración dentro.

Ejemplo

/* Marcado: nada adentro */
.banner-viejo {
}

/* O se completa, o se elimina */
.banner-viejo {
  display: none;
}

Por qué importa

Una regla vacía es CSS válido — simplemente no hace nada, coincide con elementos y no les aplica nada. Se marca solo de forma informativa porque rara vez es intencional: la causa más común es que todas las declaraciones se eliminaron durante una refactorización mientras el selector y las llaves quedaron atrás, o un bloque de regla que se empezó y nunca se terminó. Dejar esto en una hoja de estilos agrega desorden sin ningún efecto en la página renderizada, y es fácil que se acumule en silencio con el tiempo.

Frequently asked questions

¿Una regla vacía causa algún problema visible?

No — no tiene ningún efecto en el renderizado en absoluto. Esto es puramente un aviso de limpieza, no un bug de la forma en que lo son la mayoría de los otros problemas del validador.

¿Alguna vez es intencional dejar una regla vacía?

Ocasionalmente, como marcador de posición mientras se trabaja activamente en una hoja de estilos, o para reservar un selector para un cambio posterior. Fuera de eso, generalmente es seguro y más limpio eliminarla.