Why this CSS font face code does not load the font

Question

I have the written the following code in CSS for it to load the fonts. The path are double checked, they are fine, but I do not know why it does not load them up. it worked until quite several days ago. Now, it does not work. Here is the written code:

@font-face {
    font-family: Yekan;
    src:    url('font/BYekan.eot?#') format(‘eot’),    
          url('font/BYekan.woff') format('woff'),
          url(‘font/BYekan.ttf’) format(‘truetype’); 
}

please mark accepted who solved your question. Thanks :)

Parixit
– Parixit

2013-12-02 09:05:18 +00:00
Commented Dec 2, 2013 at 9:05 — Parixit
– Parixit, Commented Dec 2, 2013 at 9:05

Albzi · Accepted Answer · 2013-12-03 11:35:31Z

2

Your styles have ‘’ in them when they should be '. Change them and it should work.

@font-face {
    font-family: Yekan;
    src:  url('font/BYekan.eot?#') format('eot'),    
          url('font/BYekan.woff') format('woff'),
          url('font/BYekan.ttf') format('truetype'); 
}

edited Dec 3, 2013 at 11:35

answered Dec 2, 2013 at 8:40

Albzi

15.6k6 gold badges49 silver badges67 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Mostafa Talebi Over a year ago

thanks this has worked and so strange. I'm not a newbie to CSS3 but I'm so busy that have missed such dump point

codingrose · Accepted Answer · 2013-12-02 08:54:33Z

1

You have not written url and format in quotes.

src:url('font/BYekan.eot'); statement will use font file installed on user's computer if available and not load font file. This is important, otherwise every time font file will be loaded to user's browser even if it is available.

Try:

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

edited Dec 2, 2013 at 8:54

answered Dec 2, 2013 at 8:40

codingrose

15.7k11 gold badges41 silver badges58 bronze badges

1 Comment

Nitesh Over a year ago

Can you also explain what changes you have made for the OP to know before he makes the copy/paste?

Parixit · Accepted Answer · 2013-12-02 09:04:21Z

1

Your truetype font path wrapper should be replaced with '(single quot) not with `

@font-face {
    font-family: 'Yekan';
    src:    url('font/BYekan.eot?#') format(‘eot’),    
          url('font/BYekan.woff') format('woff'),
          url('font/BYekan.ttf') format(‘truetype’); 
}

edited Dec 2, 2013 at 9:04

answered Dec 2, 2013 at 8:38

Parixit

3,8193 gold badges39 silver badges65 bronze badges

2 Comments

Mihey Egoroff Over a year ago

Yes, the problem might be in '***', but you wrote: "it worked until quite several days ago". Did you change something after these days?

Albzi Over a year ago

@MiheyEgoroff They could have copied it from another text editor which automatically uses ‘?

sIiiS · Accepted Answer · 2013-12-03 11:05:21Z

1

Use in your style.css :

@font-face {
    font-family:'Yekan';
    src:  url('font/BYekan.eot?#') format('eot'),    
          url('font/BYekan.woff') format('woff'),
          url('font/BYekan.ttf') format('truetype'); 
}

Then use in your class :

font-family: 'Yekan', sans, helvetica;

answered Dec 3, 2013 at 11:05

sIiiS

1951 gold badge1 silver badge11 bronze badges

Collectives™ on Stack Overflow

Why this CSS font face code does not load the font

4 Answers 4

1 Comment

1 Comment

2 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

1 Comment

2 Comments

Comments

Related