UI Grid: Failed to decode downloaded font OTS parsing error: invalid version tag

Question

I know so many issues were reported for font, but after looking through all of them still i am not able to find solution for this issue. I am creating an mvc .NET application. have moved all the font files in font folder and changed my css to. Since I am facing this issue on visual studio, i am unable to provide an working example.

@font-face {
  font-family: 'ui-grid';
  src: url('../fonts/ui-grid.eot');
  src: url('../fonts/ui-grid.eot#iefix') format('embedded-opentype'), url('../fonts/ui-grid.woff') format('woff'),           url('../fonts/ui-grid.ttf') format('truetype'), url('../fonts/ui-grid.svg?#ui-grid') format('svg');
  font-weight: normal;
  font-style: normal;
}

screenshot for issue in Chrome:

screenshot for issue in Firefox:

screenshot for issue in internet explorer:

UI Grid version : 4.0.2

Answer 1

You need to download your required .woff file and .ttf file from ui-grid resources to the dir where your ui-grid.css is

https://github.com/angular-ui/bower-ui-grid/blob/master/ui-grid.ttf

https://github.com/angular-ui/bower-ui-grid/blob/master/ui-grid.woff

Or in your .html file, you directly point to the official ui-grid site so you don't need to reference files. They will take care themselves

    <link rel="stylesheet" href="http://ui-grid.info/release/ui-grid.css" type="text/css"/>

So 2 things you should do if the above is not your option

1. verify paths url('../fonts/ui-grid.woff'), url('../fonts/ui-grid.ttf')

2. You need to verify whether your MIME type is correct returned by your format ()'s and supported by your internet server. Have you added these

1. MIME 'woff' is APPLICATION/X-WOFF and

2. MIME for 'ttf's is APPLICATION/octet-Stream

to your server? It's got to be these 2 possibilities, either your path is not correct or your server config MIME is not equipped.

The original ui-grid.css has

src: url('ui-grid.eot#iefix') format('embedded-opentype'), url('ui-grid.woff') format('woff'), url('ui-grid.ttf') format('truetype'), url('ui-grid.svg?#ui-grid') format('svg');

but yours are

url('../fonts/ui-grid.woff'), url('../fonts/ui-grid.ttf')

so, do you really have ui-grid.woff on your fonts path?