Categoria HTML/CSS

Fontes declaradas com @font-face não funcionam no Firefox

Se no seu ambiente de desenvolvimento o Firefox exibia todas as fontes e na hora de colocar o site em produção a sua fonte virou comic-sans pode ficar mais tranquilo (se o seu servidor aceitar .htaccess). O problema acontece porque o Firefox tem uma restrição de arquivos de fonte mais severa que os outros browsers.

Para contornar basta colocar este código no seu .htaccess e ser feliz.

AddType font/ttf .ttf 
AddType font/eot .eot 
AddType font/otf .otf 
AddType font/woff .woff 

<FilesMatch "\.(ttf|otf|eot|woff)$">
    <IfModule mod_headers.c>
        Header set Access-Control-Allow-Origin "*"
    </IfModule>
</FilesMatch>

UPDATE: Depois da dúvida apresentada pelo rafael, fui procurar e aparentemente existe uma solução para usuários do IIS também. Seu web.config deve conter o seguinte:

<?xml version="1.0" encoding="utf-8"?> 
<configuration> 
    <system.webServer> 
        <httpProtocol> 
            <customHeaders> 
                <add name="Access-Control-Allow-Origin" value="*" />
            </customHeaders> 
        </httpProtocol> 
    </system.webServer> 
</configuration>
Comentários: 26 Categorias:

Float e overflow – Altura de elemento com filhos flutuantes

Dica de como resolver o problema de elementos html que a imagem de fundo não “estica” o suficiente, porque os últimos elementos filhos estão flutuando.

Comentários: 1 Categorias: