R
R
Ruslan Gilzidinov2016-02-03 21:19:43
Nginx
Ruslan Gilzidinov, 2016-02-03 21:19:43

How to solve the problem with my fonts in Chrome?

Hello.
I decided to transfer my cozy blog from hosting to the cloud. The blog uses 2 fonts that work via @font-face. I transfer to the cloud (on the cloud there is nginx with apache on the backend). And - voila! - these fonts no longer work in Chrome. And in Safari everything is fine.
The fonts are connected like this:

@font-face {
    font-family: 'CrashCTT';
    src: url('fonts/CrashCTT.eot?'), /* IE 5-8 */
    url('fonts/CrashCTT.woff') format('woff'), /* FF 3.6, Chrome 5, IE9 */
    url('fonts/CrashCTT.ttf') format('truetype'), /* Opera, Safari */
    url('fonts/CrashCTT.svg#svgFontName') format('svg'); /* iOS */
}

I thought maybe for some reason nginx does not want to give fonts of the required format, but no - through the Chrome stray "Inspect" determined that it was downloading fonts (already two - ttf and woff).
I'm in a stupor, I don't even know which way to dig.
Does anyone have any ideas?

Answer the question

In order to leave comments, you need to log in

2 answer(s)
A
Andrey Burov, 2016-02-03
@BuriK666

and Content-Type for them correct is given?

S
Sergey Goryachev, 2016-02-03
@webirus

I use the code that generates the "font squirrel" for fonts.
Never had any problems with the display.

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

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question