Estilo css não carrega em IE e FF

[kalua 0]

Olá a todos,

 

Eu estou com problema que realmente está deixando aflito.

 

Eu construi um site htttp://igrejasdc.com.br/artcom, só que as folhas de estilos das fonts usadas não estão surtindo efeito no template do site.

 

Obs.: Isso acontece com Explorer e Firefox, no Chrome esta tudo normal, e quando eu acesso qualquer outra area do site (usando IE ou FF) as fonts voltam aparecer.

 

Qualquer ajuda é bem-vinda inclusive opiniões sobre o que melhorar.

 

Desde já agradeço a paciência daqueles que responderem a este apelo.

[William Bruno 1501]

Vc já verificou se não é cache do ie e ff ?

Como era para ficar, e como está ficando ? para mim, aqui parece estar correto.

 

Valide o html:

 

http://validator.w3.org/check?uri=http%3A%2F%2Figrejasdc.com.br%2Fartcom%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

[kalua 0]

Olá e obrigado por ter respondido William,

 

Primeiro, você testou no IE e FF, pois em meu computador e em outros lugares tambem onde fiz testes estavam dando este erro.

 

E a propósito, eu já validei o html e pelo que pude ver não é neste ponto o problema.

[Luiz Magno 6]

sua @font-face

@font-face {
font-family: 'Source Sans Pro ExtraLight';
font-style: normal;
font-weight: normal;
src: local('Source Sans Pro ExtraLight'), url('SourceSansPro-ExtraLight.woff') format('woff');
}

adicione o seguinte codigo

@font-face {
font-family: 'Source Sans Pro ExtraLight';
font-style: normal;
font-weight: normal;
src: local('Source Sans Pro ExtraLight'), 
    url('SourceSansPro-ExtraLight.woff') format('woff')/*browsers atuais*/,
    url('SourceSansPro-ExtraLight.eot?#iefix') format('embedded-opentype'), /*IE6-IE8*/
    url('SourceSansPro-ExtraLight.ttf')  format('truetype')/* Safari, Android, iOS */;


url('SourceSansPro-ExtraLight.eot'); /* IE9*/
}

espero ter ajudado...

[mariocosta 0]

Tenta estruturar um tamanho padrão para Fonte que você utiliza, pois cada browser reconhece de forma diferente, pode ser isso que quebra o menu de seu site

[Luiz Magno 6]

é claro tem que ter os arquivos com as suas respectivas extenções no local, não basta apenas alterar o código...

 

:joia:

 

 

nesse link da adobe vem o pacote que você usa no seu site e vem com todos os formatos que eu passei...

 

só baixar e alterar o código como eu citei acima e pronto ...

 

http://store1.adobe.com/cfusion/store/html/index.cfm?store=OLS-US&event=displayFont&code=SOUP10001050

 

junto com o download vem o CSS já... peguei uma @font-face do css que vem no download para usar como exemplo

@font-face{    
font-family: 'Source Sans Pro';    
font-weight: 200;    
font-style: normal;    
font-stretch: normal;
src: local('SourceSansPro-ExtraLight'), 
     local('Source Sans Pro'),         
	url('EOT/SourceSansPro-ExtraLight.eot') format('embedded-opentype'), 
        url('WOFF/OTF/SourceSansPro-ExtraLight.otf.woff') format('woff'), 
     	url('OTF/SourceSansPro-ExtraLight.otf') format('opentype'),       
	url('TTF/SourceSansPro-ExtraLight.ttf') format('truetype');

}

[Diéssica 140]

Em quais versões dos navegadores IE e FF tu estás testando? É importante que informe esses detalhes quando reportar uma incompatibilidade assim. :)

Alguns browsers, e algumas versões deles, trabalham com [inline]@font-face[/inline] apenas em extensões específicas de fonte. Para IE 8 e versões inferiores, por exemplo, o único formato suportado é EOT. Nos browsers mais modernos, disponibilizar apenas o formato WOFF já é o suficiente.

Procure utilizar alguma ferramenta que gere diversos formatos a partir de um só, como o webfont generator do FontSquirrel. Sugiro que teste com um kit deles e veja o resultado.