¿Por qué es IE9 mostrando mis HTML5 elementos de bloque como en línea?

StackOverflow https://stackoverflow.com/questions/3766956

  •  04-10-2019
  •  | 
  •  

Pregunta

¿No HTML5 se supone que funciona en IE9? No está funcionando como se esperaba para mí.

Aquí está mi código HTML5: 

<!DOCTYPE html>
<html>
<head><title>

    Dripel - Welcome

</title>
    <!--[if lt IE 9]> 
        <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
    <![endif]-->
</head>
<body>
    <header>Welcome to Dripel</header>
    <section id="main">

        I am under development. Please check back later.

    </section>
    <footer>
    </footer>
</body>
</html>

También se puede ver en http://www.dripel.com/ .

En IE 9, los elementos <header> y <section> se visualizan como en línea. Tenga en cuenta que no estoy utilizando cualquier CSS en este momento.

¿Alguna idea de lo que está pasando?

¿Fue útil?

Solución

De acuerdo a sumergirse en HTML5, la versión final de Internet Explorer 9 no tendrá este problema.

Así que creo que se está viendo esto porque IE9 está todavía en fase beta. Tienes razón, no se debe ver esto cuando salga al mercado.

Es probable que vale la pena incluir la display: block explícita para los elementos de HTML5 de todos modos. Usted (por lo general) nunca se sabe cuando alguien va a ver a su código en un navegador pre-HTML5.

Otros consejos

Esto es cierto para otros navegadores también, no sólo IE. El mismo comportamiento se observa también para Firefox 3.6.

Desde HTML5 es sólo un borrador de trabajo, los proveedores de navegadores aún no han creado una hoja de estilo por defecto para estos elementos, por lo que por defecto se muestran los elementos en línea.

Usar una hoja de estilo de reinicio que da a estos elementos display: block si desea utilizarlos, como: 

article, aside, footer, header, hgroup, nav, section {
    display: block;
}

Copiado de CSS agente de usuario de Chrome :)

Si desea más información, bueno, entonces - leyó el href="http://msdn.microsoft.com/en-us/ie/ff468705.aspx#_HTML5" rel="nofollow versión beta notas sobre HTML5 . En ninguna parte explícitamente estado que IE9 "apoyo" a los elementos HTML5. Su concepto de apoyo también es mal definido aquí - lo que sí soportan media? Una hoja de estilo UA como la de arriba? Soporte para elementos no especificados genéricos? (Una característica que IE9 tiene, por lo que no es necesario un pequeño script para crear los elementos antes de usarlos.)

El HTML5 especificaciones sólo se habla de la semántica de cada uno de estos elementos, y nada sobre cómo los navegadores deben mostrarlos. Así que se puede esperar de un navegador que el "apoyo" de HTML5 Do?

IE 9 es compatible con algunos de HTML5. Lo mismo ocurre con todos los demás navegadores. HTML5 aún no está terminado, y el IE 9 no ha terminado, y no hay navegadores es compatible con todos HTML5. Por ejemplo, no hay navegadores que yo sepa <style scoped> soporte o <iframe seamless> todavía.

No se puede esperar cualquier navegador para apoyar todos HTML5 en un comunicado. HTML5 tiene una gran cantidad de nuevas funciones, y que todavía se encuentra en un estado de flujo. Los navegadores están implementando características de uno en uno, a veces con prefijos para evitar la incompatibilidad más adelante, a veces en las versiones beta o de desarrollo para que el diseño se puede probar antes de un lanzamiento más amplio. No es posible escribir una especificación perfecta de una sola vez, y luego todo el mundo tiene que poner en práctica todo de una vez; en cambio, características se implementan de forma experimental, la especificación está escrito que les rodea, las cosas son fijos, la especificación se actualiza, y así sucesivamente, hasta que todo el mundo está feliz de que todo está bien bonito y se implementa de forma compatible entre diferentes navegadores. Será bastante tiempo todavía antes de que todo esto sucede para todos HTML5.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top