2012-10-01 12 views
15

Recientemente hemos desarrollado un sitio web con una fuerte dependencia de Font Awesome como parte de su diseño. Estamos utilizando la implementación estándar con before: content y su CSS suministrado.Fuente Awesome no aparece en Internet Explorer 8

Por alguna razón Font Awesome no se muestra en IE8. He pasado bastantes horas solucionando problemas y probando varias correcciones, sin suerte.

que tengo:

  • Establecer los mimetype de EOT a application/vnd.ms-fontobject
  • Establecer el tipo MIME de la OTF, TTF en application/octet-stream
  • Ejecutado HTML5Shiv después de todo CSS ha sido cargado
  • varios intentos para recargar la CSS o DOM en la página de carga

Aquí está la página web: http://www.tetakere.org.nz - la caja Hotlinks es un buen ejemplo de Font impresionante

¿Alguien tiene alguna idea sobre otros enfoques para hacer que este sitio web muestre Font Awesome?

Respuesta

18

Después de una dolorosa solución de problemas finalmente lo resolví.

La solución fue mover la carga de HTML5Shiv de la sección <head> a justo antes de la etiqueta </body>.

<!--[if lt IE 9]> 
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
<![endif]--> 
</body> 
+1

Esto lo arregló para mí en IE7 pero no en 8. – Synchro

+1

Puede estar relacionado con la representación de contenido antes de la carga de la fuente. También puse 'html5-shiv' AFTER FontAwesome para resolver este problema. Ver http://stackoverflow.com/questions/9809351/ie8-css-font-face-fonts-only-working-for-before-content-on-over-and-sometimes. – leesei

2

No necesité html5shiv para obtener FontAwesome para que funcione en IE8. This answer (volver a crear el archivo .eot y reemplazar el anterior) resolvió mi problema.

2

Intenté todo, desde modificar mi configuración de apache y archivos .htaccess sin suerte. En las herramientas de desarrollo de IE me encontré con "Document Mode" y el valor predeterminado era IE7. Así que después de algunas investigaciones me encontré con esta etiqueta meta:

<meta http-equiv="X-UA-Compatible" content="IE=9"> 

Ahora es decir, 10, y 9 Formato de mi página web correcta y mostrar todos los iconos impresionantes fuente correctamente.

Si aún desea IE 8 compat entonces se podría empezar con esto:

<meta http-equiv="X-UA-Compatible" content="IE=8"> 

Espero que ayude ...

0
  1. añadido este a .htaccess."BrowserMatch MSIE mejores estándares de soporte Conjunto de la cabecera X-UA-Compatible IE = 8 env = mejores estándares de soporte"
  2. tratando de reconvertir fuente EOT
  3. doc modo de compactibilidad chnage
  4. trataron usleep función
  5. setInterval js
  6. complemento guión HTML5 de Google
  7. llamada CSS en la parte del cuerpo para IE8
  8. Agregar clase-icono de datos
  9. anuncio seudo elementos js
  10. add png & filtros SVG en css
  11. cheque tipo de fuente de permisos en el servidor

pero finalmente funciona cuando se añade

.sass y CSS .less

archivos

happy coding

9

Sé que esta es una pregunta anterior, pero tuve muchos problemas con este problema y ninguna de estas respuestas me ayudó excepto la última.

cambiado la cabeza ...

lo que funcionó para mí fue:

<meta http-equiv="X-UA-Compatible" content="IE=edge"> 

Esto también trabajaron (respuesta último que se hace referencia):

<meta http-equiv="X-UA-Compatible" content="IE=8"> 

Además, he leído (Force IE compatibility mode off using tags) que debe poner esa metaetiqueta por encima de todas las demás metaetiquetas y antes de cualquier declaración IE condicional; de lo contrario, la metaetiqueta se invalidará.

Cuestiones relacionadas