Буквы не работают с конкретными двойными буквами

Question

Мне нужно реализовать дизайн для веб-страницы, которая включает Googles Webfont под названием " Abril Fatface " и некоторые буквы.

Здесь я обнаружил странное поведение.

Письма t а также f кажется, игнорируют настройки буквенного пространства, но только если они происходят друг за другом. Они работают, как и ожидалось, если они находятся между другими буквами, и это только кажется, что с t а также f,

Кто-нибудь знает, почему это происходит?

Я пробовал это с шрифтом браузера по умолчанию, который является Segoe или Arial, я не уверен, и это, кажется, работает хорошо там. Это предназначено, и есть причина, по которой я не знаю, чтобы убрать пробел, особенно там? Или это ошибка веб-шрифта?

@import url('https://fonts.googleapis.com/css?family=Abril+Fatface');
.fatface {
  font-family: 'Abril Fatface', serif;
}

.wide-text {
  font-size: 100px;
  letter-spacing: 70px;
}

.small {
  font-size: 40px;
  letter-spacing: 20px
}

<div class="wide-text">
  <div class="fatface">botottle</div>
  <div>botottle</div>
</div>
<hr>
<div class="small">
  <div class="fatface">
    aa bb cc dd ee ff gg hh ii jj kk ll mm nn oo pp qq rr ss tt uu vv ww xx yy zz
  </div>
  <div>
    aa bb cc dd ee ff gg hh ii jj kk ll mm nn oo pp qq rr ss tt uu vv ww xx yy zz
  </div>  
</div>

Answer 1

Я предполагаю, что это лигатуры - все выглядело хорошо, когда я проверял это.

* {
font-variant-ligatures: none;
}

Должны, вероятно, сделать трюк (или заменить подстановочный знак при необходимости)