Webfont在某些窗口大小时会被切断

Question

我遇到了问题而且我不明白是什么导致了这个问题。我购买了一个很酷的字体用于响应式设计。在某些窗口大小下，字体会被窗口边缘切断。这是一个截图：

使用CSS3 word-break以某种方式解决了这个问题，但在这种情况下我不想使用它。还有其他选择吗？
我更喜欢只有CSS的选项，但如果涉及JavaScript或jQuery，我也可以使用它。

使用的字体是Armitage Black Italic from MyFonts。这是我的CSS文本：

.text {
    font-weight: normal;
    margin-bottom: 24px;
    color: blue;
    font-family: ArmitageBlack-Italic, sans-serif;
    font-size: 3.75em;
    line-height: .85;
    text-transform: uppercase;
    letter-spacing: -0.29ex;
}

只要足够大，就可以使用任何字体重新创建问题。如果字体用斜体字表示，那就非常明显了 文本在此容器内：

.container {
    display: table;
    width: 100%;
    height: 100%;
    padding-top: 25px;
    background-color: grey;
    text-align: center;
}

Answer 1

鉴于您的文本是斜体，文本将显示在“是”的位置之外 - 并且使用大字体时，问题会更糟。解决这个问题的唯一方法就是在我知道的情况下添加填充：（