mac
mac

Reputation: 95

Font not working

This font works on w3schools website, but not on my webpage and jsfiddle.

jsfiddle example

HTML

<div>
With CSS3, websites can finally use fonts other than the pre-selected "web-safe" fonts.
</div>

CSS

@font-face {
   font-family: "Penultimate";
    src: url("http://db.onlinewebfonts.com/t/17a456c0eb7e6bd88cb1d090126915f7.eot");
    src: url("http://db.onlinewebfonts.com/t/17a456c0eb7e6bd88cb1d090126915f7.eot?#iefix") format("embedded-opentype"),
    url("http://db.onlinewebfonts.com/t/17a456c0eb7e6bd88cb1d090126915f7.woff") format("woff"),
    url("http://db.onlinewebfonts.com/t/17a456c0eb7e6bd88cb1d090126915f7.ttf") format("truetype"),
    url("http://db.onlinewebfonts.com/t/17a456c0eb7e6bd88cb1d090126915f7.svg#Penultimate") format("svg");
}

div {
   font-family: Penultimate;
}

Upvotes: 3

Views: 727

Answers (1)

Jan Tojnar
Jan Tojnar

Reputation: 5524

JSFiddle uses HTTPS, therefore browsers block loading the font for security reasons. You will see errors in the browser console.

Errors in console

Firefox allows you to temporarily ignore the errors by clicking on the certificate section of the address bar.

working fonts

Upvotes: 3

Related Questions