为什么日语字符在CSS宽度动画上的行为有所不同？

Question

https://codepen.io/anon/pen/agVbPE?editors=1100

最佳可视化。转换元素的宽度时，日语字符会以断断续续，不平滑的方式出现和消失，而英语和其他看似随机的utf-8字符则不会出现。

.border {
  border: 1px dotted black;
  height: 20px;
  width: 10px;
  overflow: hidden;
  transition: width 2s;
}

.border:hover {
  width: 100px;
}

<div class="border">
トムヤムクンスープ
</div>

<div class="border">
ENGLISH 
</div>

<div class="border">
ÿÿÿÿÿÿÿÿÿÿÿÿÿÿ
</div>

<div class="border">
ぁぁぁぁぁぁぁぁぁ 
</div>

<div class="border">
ൾൾൾൾൾൾൾൾൾൾൾൾൾൾൾ
</div>

摆脱text-overflow: ellipsis;在本地为我解决了这个问题。