Acerca de este problema HTML
La especificación HTML define los atributos height y width en el elemento <embed> como enteros no negativos válidos. Esto significa que el valor debe consistir únicamente de dígitos — por ejemplo, 650 — sin unidades, espacios en blanco u otros caracteres añadidos. Cuando escribes height="650px", el validador encuentra la letra “p” donde espera otro dígito o el final del valor, y genera este error.
Este es un error común porque CSS requiere unidades (ej., 650px), y es fácil asumir que los atributos HTML funcionan de la misma manera. No es así. En HTML, el atributo height implícitamente significa píxeles CSS, por lo que escribir 650 ya significa “650 píxeles.” Añadir px no solo es redundante — hace que el valor sea inválido.
Aunque la mayoría de navegadores son tolerantes y analizarán 650px correctamente eliminando la unidad, depender de este comportamiento es problemático. Viola la especificación HTML, causa errores de validación que pueden ocultar otros problemas reales en tu marcado, y no hay garantía de que todos los navegadores o manejadores de contenido incrustado sean igualmente tolerantes. El cumplimiento de estándares asegura renderizado consistente entre navegadores y tecnologías de asistencia.
Cómo solucionarlo
Tienes dos enfoques:
-
Eliminar la unidad del atributo HTML. Cambiar
height="650px"aheight="650". Esta es la solución más simple y mantiene tu dimensionado en el marcado. -
Mover el dimensionado a CSS. Eliminar el atributo
heightcompletamente y usar una hoja de estilos o el atributostyleen línea en su lugar. Este enfoque es más flexible porque CSS soporta unidades como%,em,vh, y más.
La misma regla se aplica al atributo width en <embed>, así como height y width en elementos como <img>, <video>, <iframe>, y <canvas> — todos los cuales esperan enteros simples en HTML.
Ejemplos
❌ Inválido: unidad incluida en el atributo HTML
El sufijo px causa el error del validador porque el valor del atributo debe ser solo dígitos.
<embed src="file.pdf" type="application/pdf" width="800" height="650px">
Otras variaciones inválidas incluyen:
<embed src="file.pdf" type="application/pdf" height="100%">
<embed src="file.pdf" type="application/pdf" height="40em">
<embed src="file.pdf" type="application/pdf" height="50vh">
✅ Solucionado: entero simple sin unidad
Elimina la unidad para que el valor sea un entero no negativo válido.
<embed src="file.pdf" type="application/pdf" width="800" height="650">
✅ Solucionado: dimensionado movido a CSS
Si necesitas unidades distintas a píxeles, o prefieres mantener la presentación en tus hojas de estilos, usa CSS en lugar del atributo HTML.
<embed class="pdf-viewer" src="file.pdf" type="application/pdf">
.pdf-viewer {
width: 800px;
height: 650px;
}
✅ Solucionado: estilo en línea como alternativa
También puedes usar el atributo style directamente si una hoja de estilos separada no es práctica.
<embed src="file.pdf" type="application/pdf" style="width: 800px; height: 80vh;">
Esto es especialmente útil cuando necesitas dimensionado relativo al viewport o basado en porcentajes que los atributos HTML no pueden expresar.
Encuentra problemas como este automáticamente
Rocket Validator escanea miles de páginas en segundos, detectando problemas de HTML en todo tu sitio web.