Jascha: Sütterlin in Firefox und Chrome

Beitrag lesen

Hallo,
ich möchte eine Website auf Sütterlin darstellen. Dazu benutze ich die Sütterlin TTF font z.B. von http://www.myfont.de/fonts/infos/2683-Suetterlin.html

Ich habe dazu folgenden HTML Code erstellt.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  
<meta http-equiv="Content-Style-Type" content="text/css">  
<style type="text/css">  
@font-face {  
  font-family: "Sutterlin";  
  src: url(suetter.ttf) format("truetype");  
}  
</style>  
</head>  
<body >  
<span style="font-family:Sutterlin; font-size:10px;">Test</span>  
<br />  
<span style="font-family:Sutterlin; font-size:20px;">Test</span>  
</body>  
</html>  
  

Jetzt habe ich folgendes Problem:
Im Firefox wird die 1. Zeile korrekt in Sütterlin dargestellt. Die 2. Zeile wird allerdings in einer anderen Schriftart dargestellt.
Auch wenn ich mit Strg++ die Seite vergrößere sind irgendwann beide Zeilen "normal". Anscheinend wird ab einer bestimmten Größe das Sütterlin nicht mehr dargstellt.

Kann mir jemand sagen woran das liegt und wie ich das beheben kann?

Vielen Dank
Jascha