Fix benutzerdefinierte schriftart line-height mit CSS

Ich habe erleben ein seltsames Problem, wenn Sie eine benutzerdefinierte schriftart auf eine neue webapp, die ich arbeite.

Diese benutzerdefinierte schriftart (FF DIN) zu haben Scheinen, natürlich vertikal off-center-line-height, die mich zwingen, einige setzen padding-top hack zum Ausgleich der top-Platz auf-element button und input.

Beispiel: die Schrift in grün (Helvetica Neue) richtig auszurichten, wo Sie die benutzerdefinierte schriftart verwenden wir (FF DIN) ist vertikal zentriert:

Fix benutzerdefinierte schriftart line-height mit CSS

Gibt es irgendeine bekannte Art und Weise zu beheben, dass die Zentrierung Ausgabe über das CSS natürlich, irgendwie in Kräfte font-baseline-Verhalten?

Danke.

Dies ist nicht für line-height aber über die vertikale Platzierung von Glyphen.
Jede andere plausible Lösung für dieses? abgesehen von der akzeptierten Lösung? Ich will nicht zu Bearbeiten, die schriftart manuell

InformationsquelleAutor kirkas | 2015-01-23

  1. 2

    Ich hatte das problem auch in der Vergangenheit, auch bei verschiedenen Browsern gab verschiedene Zeilenabstände! Ich denke, es passiert, wenn mit dem webfont-generator und kann nur behoben werden mit den verschiedenen line-height, soweit ich weiß.

    Haben Sie versucht, fontsquirrel? Es gibt einige Optionen, mit unterschiedlichen Ergebnissen.

    http://everythingfonts.com/font-face

    http://www.font2web.com/

    http://www.fontsquirrel.com/tools/webfont-generator

    https://www.web-font-generator.com/

    Fontsquirrel hat eine option zum ändern der x-Höhe, außer font von fontshop geschützt sind ..

    InformationsquelleAutor Marc

  2. 2

    Im Endeffekt habe ich am Ende manuell die Festsetzung der schriftart selbst, mit Hilfe von dieser Antwort:

    UIButton benutzerdefinierte schriftart für die vertikale Ausrichtung

    InformationsquelleAutor kirkas

  3. 1

    Dies ist etwas, das ich in jüngster Zeit. Die Grundlinie, auf die Schriftarten, die ich aus irgendeinem Grund nicht line-up, so dass ich ausgerichtet auf den Boden und erhöht die Zeilenhöhe anstatt Polsterung.

    Dies ist, wie ich mein Problem gelöst, wenn Sie einen link zu einem code-Stift kann ich überprüfen, ob es für Sie arbeiten, oder ob eine andere Lösung besser wäre. 

    p {

    vertical-align: text-bottom;
    line-height: 1.5;

}
    Ich habe versucht aber das hat nicht alles verändert, ich kann nicht wirklich sagen, codepen als diese Schrift geschützt ist

    InformationsquelleAutor Sara Mote

  4. 1

    In Chrome ich habe festgestellt, dass, wenn Sie ein font-face-Deklaration. Können Sie lösen die line-height Problem mit einem style="" rufe ich die HTML, oder einfach zu deklarieren, die Linie-Höhe NACH der font-Deklaration in der CSS.

    Ich denke, dass Chrome einfach nicht wissen, wie Sie zur Berechnung die line-height, bis es gerendert, die benutzerdefinierte schriftart.

    InformationsquelleAutor chrisallick

Schreibe einen Kommentar