Webkit 浏览器在左侧裁剪斜体字体

Question

我在使用手写 Google 网络字体 Meddon 的个人初始页面上遇到了问题。正在发生的事情是，Webkit 浏览器（Chrome、Safari、iOS Safari）看似随机地剪裁了字体的左侧。

您可以在my personal page 上查看该问题。 JH的左侧会在刷新或调整页面大小时随机出现/消失。

有人知道这个的解决方案吗？更好的是，有人知道导致这种行为的原因吗？

Answer 1

是因为你的jh容器宽度不够，看这里

Demo

像这样更新 .jh 类 - Working Demo

.circle .jh {
    margin-top: 50px; /* You can adjust this */
    font-family: "Meddon";
    font-size: 75px;
    width: 200px;
    height: 120px;
    text-align: center;
    color: #f2f2f2;
    text-shadow: 1px 1px #ff8e00;
    border: 1px solid #ff0000;
}