IE8 display inline-block no funciona

Digamos que tengo el siguiente código

 span, ul, ul li { display: inline-block; vertical-align: top; margin: 0; padding: 0; list-style: none; }  i would want 
  • this
  • on
  • one line.

Quiero que esto se muestre en línea en IE8. En todas partes que he leído todo dice que esto debería funcionar, IE8 es compatible con Inline-Block. Sin embargo, después de una mañana de bashs, no puedo hacer que lo anterior se alinee. Sé que podría flotar, pero con los otros elementos en mi página (que no se muestran aquí) necesitaría usar un ‘clearfix’ que es más marcado. Solo necesito apuntar a IE8 y me encantaría saber por qué el bloque en línea no funciona para mí cuando aparentemente es compatible. El código anterior hace lo que quiero cuando se ve en Google Chrome.

Supongo que no has declarado un doctype. Intente colocar esto en la primera línea, antes de la etiqueta html:

 < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

El código que pegaste funciona en IE8 con ese tipo de documento.

No todas las versiones de IE8 parecen funcionar por igual. Descubrí que el código dado, incluso con un DOCTYPE, no funciona en IE 8.0.6001.18702, que es una versión anterior.

Sin embargo, la solución alternativa para versiones de IE más bajas también hizo su trabajo en ese IE 8 particular:

  

Puede establecer margin-right: 1px

funcionó para mí bastante bien

En mi experiencia, siempre es una mejor idea usar la forma universal (IE6 +) de declarar un bloque en línea. Incluso si se dirige a navegadores más nuevos cada vez que he intentado decir que solo es compatible con navegadores más nuevos, algunos clientes aún se equivocan con su tipo de documento, y luego las ventas dicen que es necesario corregirlo, porque los clientes todavía pueden verlo y no lo entiende, que depende de su configuración de IE y no es nuestra culpa. Además, cuando utiliza bloques en línea para elementos estructurales, evita que el sitio se desintegre por completo si el usuario está viendo el sitio en un IE antiguo por cualquier razón.

 display: inline-block; *zoom: 1; *display: inline; 

IE8 lo tratará como un elemento de nivel de bloque a menos que use float.

 .divInlineBlock { display: inline-block; float: left; } 

Tenga en cuenta que IE8 actuará como IE7 si está viendo un sitio de intranet, lo que puede suceder a medida que se desarrolla. Vea esta pregunta de StackOverflow:

IE8 Rendering como IE7 por defecto?

Para IE8 – puede agregar una statement específica:

display: inline-table;

que funciona genial