当字体上面有令人讨厌的 space 时，使用 CSS 的文本垂直对齐

Question

我最近为一个网站项目购买了几种字体，但我发现其中一种字体使用起来一点也不有趣。它叫做 Goodlife Sans，我遇到的问题是字体字符上方包含大量白色 space，即字体比字形本身占据更多的垂直 space。

很难设置垂直边距，因为我必须考虑字体占用的额外 space。设置 line-height: 1em 有点帮助，但行高是从字体的最顶部开始测量的，这意味着如果文本设置在带有 overlow: hidden 的块元素中，字母的底部将被裁剪掉。

下图显示了字体本身的高度，以及行高修改。为清楚起见，块元素的背景颜色为红色。

http://i.stack.imgur.com/VAjKz.png
http://i.stack.imgur.com/ffL9l.png

编辑：这是代码

@import url("//hello.myfonts.net/count/2e978a");

@font-face {
    font-family: "GoodlifeSans";
    src: url("fonts/2E978A_0_0.eot");
    src: url("fonts/2E978A_0_0.eot?#iefix") format("embedded-opentype"),
         url("fonts/2E978A_0_0.woff2") format("woff2"),
         url("fonts/2E978A_0_0.woff") format("woff"),
         url("fonts/2E978A_0_0.ttf") format("truetype");
} 
p {
    font-family: "Goodlifesans";
    font-size: 344%;
    background: red;
    text-align: center;
    /*line-height: 1em;*/
    margin: 0;
    padding: 0;
}
body {
    margin: 10px;
    font-size: 80%;
}

<body>
    <p>This is the test title text</p>
</body>

如果没有实际修改字体本身（我相信许可会阻止我这样做）是否有解决此问题的优雅方法？我真的不想在每次使用这种字体时都包含一个负边距的父元素。

Answer 1

最后，HDV Fonts 的人向我发送了他们解决问题的字体文件副本。来自 myfonts.com 的文件显然包含奇怪的垂直指标，这解释了我所看到的。

当字体上面有令人讨厌的 space 时，使用 CSS 的文本垂直对齐

Vertical alignment of text using CSS when the font has annoying space above it

html

css

fonts

typesetting