Foros del Web » Creando para Internet » CSS »

Problema con sintaxis de font-face en IE9

Estas en el tema de Problema con sintaxis de font-face en IE9 en el foro de CSS en Foros del Web. Hola, me uní a este foro para poder hacer una consulta debido a que ya estoy medio desesperado. Tengo problemas cargando una fuente desde @font-face ...
  #1 (permalink)  
Antiguo 08/08/2011, 16:11
 
Fecha de Ingreso: julio-2008
Mensajes: 15
Antigüedad: 9 años, 3 meses
Puntos: 0
Problema con sintaxis de font-face en IE9

Hola, me uní a este foro para poder hacer una consulta debido a que ya estoy medio desesperado. Tengo problemas cargando una fuente desde @font-face en Internet Explorer 9. El código CSS es el siguiente:

Código:
@font-face {
     font-family: 'Cursive';
     src: url('cursive-webfont.eot');
     src: url('cursive-webfont.eot?#iefix') format('embedded-opentype'),
          url('cursive-webfont.woff') format('woff'),
          url('cursive-webfont.ttf') format('truetype'),
          url('http://pitanza.net/fonts/cursive/cursive-webfont.svg#Clarendon') format('svg');
 }
El problema está sucediendo en este sitio [URL="http://santodiseno.bootic.net"]http://santodiseno.bootic.net[/URL]

Busqué info a través de Google y en este mismo sitio pero nada me sirvió. A ver si ustedes ven algo que yo no.

Saludos.
  #2 (permalink)  
Antiguo 09/08/2011, 00:58
 
Fecha de Ingreso: abril-2010
Mensajes: 122
Antigüedad: 7 años, 6 meses
Puntos: 18
Respuesta: Problema con sintaxis de font-face en IE9

yo utilizo esta forma..

@font-face {
font-family: 'Nissan';
src: url('NissanAG-Medium.eot?') format('eot'), url('NissanAG-Medium.woff') format('woff'),
url('NissanAG-Medium.ttf') format('truetype'), url('NissanAG-Medium.otf');
font-style: normal;
}

obviamente las fuentes deben estar en ese formato. Talvez este sitio te ayude..
http://www.fontspring.com/
  #3 (permalink)  
Antiguo 09/08/2011, 04:04
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 10 años, 3 meses
Puntos: 1567
Respuesta: Problema con sintaxis de font-face en IE9

El código para fontface que pusiste es correcto, no se si la fuente en si tenga algún problema, más allá de eso, Cual es el problema? Cual es el texto que debería tener la fuente? el menú que dice
Catálogo Recién llegado Promociones ¿Cómo comprar? Despacho Contacto Hom...
Solo se ve en Chrome Y Safari

en Firefox, Opera e IE, la fuente no se ve.

Lo más seguro es que tengas un problema con las rutas de las fuentes, vi varias que cargan externas.

en una prueba final
agergué esto a tu css

Código CSS:
Ver original
  1. @font-face{
  2. font-family:Fontin-Regular;
  3. src: url('http://foros.emprear.com/fontface/fontface/Fontin-Regular.eot');
  4. }
  5.  
  6. @font-face{
  7. font-family: Fontin-Regular;
  8. src: url('http://foros.emprear.com/fontface/fontface/Fontin-Regular.otf') format('opentype');

y al cursive lo cambie por Fontin-Regular y en FF se corrigió,

__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #4 (permalink)  
Antiguo 09/08/2011, 13:42
 
Fecha de Ingreso: julio-2008
Mensajes: 15
Antigüedad: 9 años, 3 meses
Puntos: 0
Respuesta: Problema con sintaxis de font-face en IE9

emprear: ¿Te funcionó en IE9? En mis test es el único navegador en que me da problemas. (En Firefox sé que cuando son tipografías están en un servidor externo estas no cargan).
  #5 (permalink)  
Antiguo 09/08/2011, 15:47
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 10 años, 3 meses
Puntos: 1567
Respuesta: Problema con sintaxis de font-face en IE9

No, en ie9 no funcionó y no pude hacer la prueba, pero en Firefox tampoco funcionaba, y le cargue editando los estilos, fuentes que estan en mi server y funcionó perfecto.
Vi que los que usas son los kits de font-squirrel, esos andan bien en todos los navegadores, si hay un problema generalmente son las rutas.

y siempre es recomendable que las tengas en tu propio server.
Con respecto a las urls externas, lo podés corregir, si usas Apache con estas directivas en .htaccess

Código Apache:
Ver original
  1. <IfModule mod_headers.c>
  2. ### Ejemplo con una url específica
  3. ### Header set Access-Control-Allow-Origin http://momardi.s3.amazonaws.com
  4. Header set Access-Control-Allow-Origin "*"
  5. </IfModule>
  6.  
  7. <FilesMatch "\.(ttf|otf|eot|svg|woff)$">
  8.    <IfModule mod_headers.c>
  9.        Header set Access-Control-Allow-Origin "*"
  10.    </IfModule>
  11. </FilesMatch>

Suponiendo claro está , que tu server tiene habilitados dichos números

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #6 (permalink)  
Antiguo 10/08/2011, 01:58
Avatar de Null_  
Fecha de Ingreso: octubre-2008
Ubicación: Santiago
Mensajes: 530
Antigüedad: 9 años
Puntos: 30
Respuesta: Problema con sintaxis de font-face en IE9

El código del principio está generado con www.fontsquirrel.com, por lo que me parece muy raro que contenga una ruta externa y que tengas problemas con el código.
Podrías probar generar de nuevo el kit en fontsquirrel e implementarlo nuevamente.

Saludos.
__________________
Diego Escares
• Twitter: @diegoescares
• Web: diegoescares.com
  #7 (permalink)  
Antiguo 10/08/2011, 08:16
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 10 años, 3 meses
Puntos: 1567
Respuesta: Problema con sintaxis de font-face en IE9

@jorgerock:
Parece solucionada, que era en definitiva?

@Null_ : que el código sea de fontSquirrel, no significa que alguien lo haya modificado, entre otras cosas el css contiene esto

Código CSS:
Ver original
  1. @font-face {
  2.      font-family: 'Cursive';
  3.      src: url('cursive-webfont.eot');
  4.      src: url('cursive-webfont.eot?#iefix') format('embedded-opentype'),
  5.           url('cursive-webfont.woff') format('woff'),
  6.           url('cursive-webfont.ttf') format('truetype'),
  7.           url('http://pitanza.net/fonts/cursive/cursive-webfont.svg#Clarendon') format('svg');
  8.  }
  9.  
  10. @font-face {
  11.      font-family: 'Clarendon';
  12.      src: url('http://pitanza.net/fonts/clarendon2/clarendonltstd-webfont.eot');
  13.      src: url('http://pitanza.net/fonts/clarendon2/clarendonltstd-webfont.eot?#iefix') format('embedded-opentype'),
  14.           url('http://pitanza.net/fonts/clarendon2/clarendonltstd-webfont.woff') format('woff'),
  15.           url('http://pitanza.net/fonts/clarendon2/clarendonltstd-webfont.ttf') format('truetype'),
  16.           url('http://pitanza.net/fonts/clarendon2/clarendonltstd-webfont.svg#Clarendon') format('svg');

Y justamente la fuente que no andaba era la Cursive, que usa una ruta relativa


Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #8 (permalink)  
Antiguo 10/08/2011, 20:16
 
Fecha de Ingreso: julio-2008
Mensajes: 15
Antigüedad: 9 años, 3 meses
Puntos: 0
Respuesta: Problema con sintaxis de font-face en IE9

Finalmente era problema de la sintaxis imagino, probaba de una forma y cargaba en IE9 y FF, pero no en navegadores con Web-kit... finalmente corté por algo más sencillo y ocupé una webfont de google, de todas formas quizás aplique un hack para CSS y haga un pequeño experimento y ver si funciona.

Etiquetas: font-face, ie9, sintaxis
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:07.