1,105,625 Community Members

Custom font not loading on first page load

Member Avatar
minitauros
Practically a Master Poster
606 posts since Apr 2011
Reputation Points: 67 [?]
Q&As Helped to Solve: 105 [?]
Skill Endorsements: 6 [?]
 
0
 

Does anybody know of a reason why a custom font would not load directly when a web page is loaded? When I visit the main page of my website, it uses a standard font instead of the custom font I selected, but if I then go to another page, that page does use the custom font, and when I then go back to the main page, the custom font is working all of a sudden. Anyone know how to fix this?

Member Avatar
JorgeM
IT Addict
6,414 posts since Dec 2011
Reputation Points: 581 [?]
Q&As Helped to Solve: 963 [?]
Skill Endorsements: 172 [?]
Moderator
Featured
Sponsor
 
0
 

Do you have this site online so we can take a look?

Member Avatar
minitauros
Practically a Master Poster
606 posts since Apr 2011
Reputation Points: 67 [?]
Q&As Helped to Solve: 105 [?]
Skill Endorsements: 6 [?]
 
0
 

I certainly have: http://bit.ly/1ct3Vhr

The website is written in Dutch but I think you won't have to read the website's content to discover how the architecture is built ;).

Member Avatar
pritaeas
mod_pritaeas
11,315 posts since Jul 2006
Reputation Points: 1,420 [?]
Q&As Helped to Solve: 1,835 [?]
Skill Endorsements: 156 [?]
Moderator
Featured
Sponsor
 
0
 

I don't see the issue. Browser specific perhaps?

Member Avatar
minitauros
Practically a Master Poster
606 posts since Apr 2011
Reputation Points: 67 [?]
Q&As Helped to Solve: 105 [?]
Skill Endorsements: 6 [?]
 
0
 

Hm yes, now that you mention it, it appears only to occur in Firefox.

EDIT: And in IE as well.

Member Avatar
JorgeM
IT Addict
6,414 posts since Dec 2011
Reputation Points: 581 [?]
Q&As Helped to Solve: 963 [?]
Skill Endorsements: 172 [?]
Moderator
Featured
Sponsor
 
0
 

I'm not a CSS3 Web Fonts guru... but your CSS doesnt appear to be written 100% correctly. For example, you included the src property two times. I havent seen it written in that manner in the past. Nothing else seems to jump at me as something that could be causing this error. try fixing this issue and see if it resolves your problem.

@font-face {
    font-family: 'Candara';
    src: url('candara.eot');
    src: url('candara.eot') format('embedded-opentype'),
         url('candara.woff') format('woff'),
         url('candara.ttf') format('truetype'),
         url('candara.svg#CandaraRegular') format('svg');
}
Member Avatar
pritaeas
mod_pritaeas
11,315 posts since Jul 2006
Reputation Points: 1,420 [?]
Q&As Helped to Solve: 1,835 [?]
Skill Endorsements: 156 [?]
Moderator
Featured
Sponsor
 
0
 

And in IE as well.

Which version? I didn't see it in my IE.

Member Avatar
minitauros
Practically a Master Poster
606 posts since Apr 2011
Reputation Points: 67 [?]
Q&As Helped to Solve: 105 [?]
Skill Endorsements: 6 [?]
 
0
 

I'm using IE10. Might be caused by me removing some lines from my CSS font file. I'm trying if it works if I specify a .ttf font only, but apparently it doesn't (at least not over here). Only Chrome appears to be loading the correct font file on the fist page load; Firefox and IE both aren't over here. Weird but I guess I'll have to do with this for now.

Member Avatar
pamsb2
Newbie Poster
3 posts since Jan 2013
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

Hi,
I'll be pleased to help u but I compare the only 2 pages and i don't see any difference about the font...
Perhaps you could help me to navigate.

You
This article has been dead for over three months: Start a new discussion instead
Post:
Start New Discussion
View similar articles that have also been tagged: