Различные результаты при использовании процентов и ems

Question

Я устраивал свою навигационную панель, и я обнаружил кое-что, что я не совсем понимаю. Когда я использовал проценты для поля и я не был доволен результатом, я использовал ems и получил другой результат. Почему это происходит? Это не потому, что процент больше, я пробовал с 0,4%, тот же результат. Как получить тот же результат с процентами?

код с EMS:

.navigation a:hover { 
    text-decoration: none; 
} 
nav{ 
    padding-top: 1%; 
    float: right; 
} 
.navigation a{ 
    margin-right: 2em; 
    font-size: 1.5em; 
} 

Результат:

код с процентами:

.navigation a:hover { 
    text-decoration: none; 
} 
nav{ 
    padding-top: 1%; 
    float: right; 
} 
.navigation a{ 
    margin-right: 2%; 
    font-size: 1.5em; 
} 

И результат:

Answer 1

Это потому, что 2em является своего рода от как «2 раза выше размера шрифта», но 2% представляет собой процент от окна

Answer 2

1 em = (размер шрифта) = 100%

В принципе, у вас есть только небольшое недоразумение em vs %