отображение ширины текста в браузере html

Question

Следующий фрагмент кода создает два набора строк текста с увеличивающимися размерами шрифта (очевидно, их нужно окружить некоторым базовым html)

<p style="font-size: 0.50em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 0.55em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 0.60em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 0.65em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 0.70em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 0.75em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 0.80em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 0.85em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 0.90em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 0.95em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.00em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.05em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.10em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.15em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.20em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.25em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.30em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.35em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.40em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.45em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.5em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.55em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.60em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.65em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.70em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.75em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.80em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.85em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.90em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 1.95em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.00em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.05em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.10em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.15em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.20em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.25em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.30em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.35em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.40em;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.45em;">ABCDEFGHIJKLMNabcdefghijklmn</p>

<p style="font-size: 2.00vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.05vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.10vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.15vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.20vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.25vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.30vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.35vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.40vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.45vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.5vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.55vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.60vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.65vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.70vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.75vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.80vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.85vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.90vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 2.95vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.00vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.05vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.10vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.15vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.20vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.25vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.30vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.35vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.40vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.45vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.5vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.55vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.60vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.65vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.70vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.75vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.80vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.85vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.90vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>
<p style="font-size: 3.95vw;">ABCDEFGHIJKLMNabcdefghijklmn</p>

Почему длина текста в первом наборе не пропорциональна размеру шрифта, заданного в единицах em, тогда как во втором наборе она намного лучше с размером шрифта в единицах vw? Даже во втором наборе есть переходы, то есть ширина для некоторых линий такая же, как у предыдущей.