Почему к высоте текста добавляются лишнии пиксели?

Question

[vasIvas]

Есть обычный ul - div.container>ul.nav>li.nav-link-container*4>a[#]{some link $}
И есть стиль -

html{font-size: 16px;}
* {margin: 0;padding: 0; border: 0;}
a {text-decoration: none; color: #232;}
ul {list-style: none;}

В браузере измеряю размер текста и он 19px. Почему и как исправить?

Вот пример на codepen. В FF показывает 19px.. codepen.io/anon/pen/zvLBEL?editors=110

Comments

[Ivanq]

Скрин из WebTools в студию.

[Ivanq]

vasIvas: Да нет. Мне нужно, чтобы понять, в чем проблема.

[vasIvas]

Ivanq: ну я добавил целый пример. А по картинке с надписью 19px Вы ТОЧНО не сможете понять.

Answer 1

[Ivanq]

line-height: 16px;

UPD Блин. Ошибся ссылкой. jsfiddle.net/Ivanq/zwcggkqp/1

Comments

[vasIvas]

дайте ссылку на этот пример. У меня все так же 19..

[Ivanq]

vasIvas: jsfiddle.net/Ivanq/zwcggkqp

[vasIvas]

Ivanq: последняя версия FF

[Ivanq]

vasIvas: А для какого тега? a или div?

[vasIvas]

Ivanq: блин Вы меня реально разводите чтоль? Конечно для .

[Ivanq]

vasIvas: У вас тег съелся.

[vasIvas]

Ivanq: фак, для а

[Ivanq]

vasIvas: Блин. jsfiddle.net/Ivanq/zwcggkqp/1

[vasIvas]

Ivanq: спасибо!

Answer 2

[L0k1]

line-height ?

Comments

[Кирилл]

Да, скорее всего. Попробуйте менять это значение и посмотреть на изменение высоты текста

[vasIvas]

Применил к тегу , но результат прежний...

[vasIvas]

Кирилл Кубляков: добавил ссылку на пример и был бы рад если бы Вы посмотрели и сделали. У меня не получается.

[L0k1]

html{font-size: 16px; line-height: 1;}

[vasIvas]

L0k1: все по прежнему... 19px...

[Денис Букреев]

vasIvas: 16px по твоей ссылке

[vasIvas]

L0k1: даже если ноль задать значение, то строки собираются в кучу, а размер по прежнему 19px. И даже css-reset ставил и ничего не меняется.

[vasIvas]

Денис Букреев: нет

[L0k1]

vasIvas: все,, я понял о чем речь. Этот размер - зависит от шрифта. Поставите georgia - будет, например, высота 20... только мне не понятно зачем вам знать именно этот размер, если он ни на что не влияыет?

[vasIvas]

L0k1: я хотел позицию меню рассчитать calk(100% - 1rem) но там зазор в шесть пикселей, а то и вообще непредсказуемый.

[vasIvas]

L0k1: сейчас я тогда другой вопрос задам, но он скорее всего будет аналогичным. То есть ответ будет, а зачем Вам это :)

[L0k1]

calc.. от 100% высоты, учитывая высоту шрифта... тут как бы не самый лучший вариант расчетов - да и вообще calc шутка тяжеловесная и я бы не советовал ее пихать абы куда

[vasIvas]

L0k1: ну если нажатие на кнопку это тяжеловесное, то лучше вообще отказаться от интернета. И если расчет позиции для кнопки это абы куда, то тоже лучше забыть о интернете.

[L0k1]

vasIvas: при чем здесь нажатие на кнопку? Я говорю, что у вас подход к решению вашей задачи как минимум не оптимален, как максимум - неверен.

[vasIvas]

L0k1: возможно, но я ищу правильное решение. Вот можете поспособствовать Как понять работу padding? и указать правильное направление. А то мне так и будет казаться что правильнее работать с заранее установленными мной значениями, а не наугад вычитать значения, чтобы потом каждый раз подгонять размеры.