@ font-face funktioniert nicht in Internet Explorer Mobile
Ich habe eine Website erstellt (http://www.hallometmirel.nl/troep/website) mit einem ansprechenden Layout und haben die verschiedenen Auflösungen in verschiedenen Browsern und Auflösungen auf meinem Laptop und auf meinem Galaxy S3 getestet.
Da ich bei Google Play keinen Internet Explorer bekomme, teste ich die Website jetzt auf einem Nokia Lumia 800 von der Arbeit aus. Es läuft anscheinend unter Windows Phone 7.5, und da ich keine Schaltfläche finde, die angibt, um welche IE-Version es sich handelt, und das Smartphone ziemlich neu ist, vermute ich, dass es sich um IE 9 handelt.
@ font-face hat bisher in der neuesten Version von Opera, Firefox, Chrome (Desktop und Mobile) und IE 9 (Desktop) funktioniert.
Ich habe wirklich keine Ahnung, warum es in der mobilen Version nicht funktionieren würde, auch wenn es eine ältere ist, wird Font-Face von älteren Versionen unterstützt, oder? Ich habe versucht, IE dazu zu bringen, die Schriftart anzuzeigen, indem ich den .eot-Typ ändere oder ein Smiley-Gesicht hinzufüge (anscheinend tut es etwas). Ich kann keine anderen Themen in Bezug auf die Mobilversion von IE finden.
Dies ist der Dokumententyp, der möglicherweise etwas mit IE9 zu tun hat:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="nl-NL">
<head xmlns:og="http://ogp.me/ns#">
Und so binde ich die Schrift ein:
@font-face {
font-family:'ChaletComprime-CologneEighty';
src:url('fonts/ChaletComprime-CologneEighty.eot');
src:url('fonts/ChaletComprime-CologneEighty.eot?#iefix') format('embedded-opentype'),
url('fonts/ChaletComprime-CologneEighty.woff') format('woff'),
url('fonts/ChaletComprime-CologneEighty.ttf') format('truetype'),
url('fonts/ChaletComprime-CologneEighty.svg#svg/ChaletComprime-CologneEighty') format('svg')
}
Und benutze es so:
h1,h2,h3,h4,h5,h6{font-family:ChaletComprime-CologneEighty;color:#ef0f63;text-transform:uppercase}