- Obtener enlace
- Correo electrónico
- Otras aplicaciones
IE8 en vez de anidar el contenido de etiquetas conocidas dentro de las desconocidas, lo coloca al mismo nivel, por tanto cualquier estilo asociado a las nuevas etiquetas no será aplicado.¿Se puede arreglar esto?
Pues aunque parezca mentira, la respuesta es sí. Pilgrim nos comentaque si a través de JavaScript creamos etiquetas con document.createElement, IE8 las reconocey genera correctamente el árbol de documento.
Remy Sharp ha sintetizado esta solución enun JavaScript que se pueden cargar condicionalmente en versiones de IE inferiores a la 9. Elproyecto está alojado en Google Project y se llama html5shim
Se puede descargar el mini .js o simplemente referenciarlo con este comentario condicionalque el resto de navegadores obviarán:
<!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
Si incluimos este código en el <head> obtenemos la siguiente página en IE8:
Si examinamos el árbol del documento veremos que se han anidado correctamente loscontenidos
de la sección, artículo, cabecera y pie. Sin embargo, sigue sin verseadecuadamente
Si nos fijamos cómo interpreta la página Firefox 3.6 encontramos bastantes similitudes.¿Qué está ocurriendo ahora?Es sencillo. En principio, las nuevas etiquetas estructurales de HTML5 , según la W3C, no deben tener ningún estilo por defecto. Aparte de la semántica que aportan, en lo querespecta a los estilos se comportan exactamente igual que un <div>. Pero un <div> sí tiene unatributo CSS definido y es que se muestre como bloque (display: block;)
Así que si incluimos una definición de estilo como esta para todas las etiquetas estructuralesde HTML5, debería quedar solucionado para IE8 e inferiores y Firefox 3.6:
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav,section {display: block;}
Ahora nuestra página de ejemplo se vería así en IE8 y Firefox 3.6:
Comentarios
Publicar un comentario