font-face problem in chrome

Question

This is my font-face declaration I have used.

@font-face {
font-family: SolaimanLipi;
src: url("font/SolaimanLipi_20-04-07.ttf");

}

This is working perfectly in Firefox but I'm getting wrong with chrome. After 'inspect element' i got the following message:

Resource interpreted as font but transferred with MIME type application/octet-stream.

Any suggestions will be appreciated.

Answer 1

As usual, different browsers have different needs. Here is a cross browser @fontface declaration, taken from the Paul Irish blog -

@font-face {
  font-family: 'Graublau Web';
  src: url('GraublauWeb.eot');
  src: local('☺'),
         url('GraublauWeb.woff') format('woff'), url('GraublauWeb.ttf') format('truetype');
}

.eot is for IE, the rest of the browsers use either .woff or .ttf If you need to generate the different types from the source font, you can use Font Squirrel's font-face generator

You also need to an .htaccess to the location of the fonts adding the following types:

AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf

Answer 2

What about adding AddType font/ttf .ttf in a htaccess ?

Answer 3

if you can edit an .htaccess file you should try add

addType font/ttf .ttf

otherwise you could use a svg/svgz font instead