@ Font-face Problem, fügt Firefox Polsterung, Chrome nicht

StackOverflow https://stackoverflow.com/questions/3400296

  •  25-09-2019
  •  | 
  •  

Frage

Wenn Sie eine benutzerdefinierte Schriftart über @font-face verwenden, wird es machen, so wie ich denke, es sollte in Chrome. In Firefox, aber eine zusätzliche Polsterung (oben und unten) mit dem Zeichensatz hinzugefügt.

Hier ist meine Beispielseite, die das Problem umreißt.

Gibt es etwas, was ich dagegen tun kann?

War es hilfreich?

Lösung

Zu Ihrer Information, geschieht dies auch in Firefox unter Linux (und nicht in Chrom). Ich habe versucht, Ihre Schrift in Fontforge zu laden und sofort eine Warnung bekommen:

  

Die folgende Tabelle (n) in der Schrift wird von Fontforge
ignoriert   Ignoring ‚LTSH‘ lineare Schwellenwerttabelle
  Ignoring ‚VDMX‘ vertikal Gerät Metriken Tabelle
  Ignoring 'hdmx' horizontal Gerät Metriken Tabelle

Ich denke, das Problem ist, dass das VDMX (Vertical Geräte Metrics) Tabelle ist defekt:

  

Um zu vermeiden, Rasteranpassung des   ganz Schrift zu bestimmen, die richtigen   Höhe, hat die Tabelle VDMX gewesen   definiert.

Das sieht genau wie das, was passiert in Firefox: irgendwo die Minimal- und Maximalhöhe wird falsch berechnet. Dies ist auch klar, wenn Sie den Text auswählen: das Auswahlfeld erstreckt sich bis zum äußersten oberen und unteren Ende der Leitung; wenn das h1 Element wirklich Polsterung hat, würden Sie eine Lücke zwischen dem oberen und unteren Ende der Leitung und dem Auswahlfeld sehen.

Auch die Validierung ergab, dass fast jede Glyphe ist „ fehlende Punkte bei Extrema “:

  

Sowohl PostScript- und Truetype würde   wie Sie Punkte an den Maxima haben   und Minima (die Extrema) ein Pfad.

Eine schnelle suchen zeigte:

  

Das einzige andere Problem hatte ich ein   ziemlich unangenehme Krankheit namens „Missing   Punkte bei Extrema“. Mit einer Schrift,   Es muss einen Punkt (oder Knoten sein, wie   sie sind in Inkscape) bei der angerufene   Ganz links, rechts, oben und unten   eine Glyphe. Normalerweise sind sie da   sowieso nur wegen der Art und Weise Ihres   Glyphe ist eingebaut, aber diagonale Linien   mit abgerundeten Enden oft zu Problemen führen,    [Quelle, einschließlich Bild (nach unten scrollen)]

Andere Tipps

Just Add: 

line-height:1;

auf Ihre CSS-Regeln

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top