Почему в Скетче размер текстового блока не равен размеру самого текста?

Question

[saveTibet]

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

Answer 1

[Иван Желудков]

Вы чего-то не понимаете.
Есть высота строки 18px. В ней текст 14px. Тогда в строке останется свободное место 4px.
Когда фронтендер будет верстать это, все размеры отступов будут считаться от краев строк. Браузер понимает текст так же, как Sketch.

Вам нужно привыкнуть к тому, что край текста это край строки, а не последний пиксель сверху или снизу.

Comments

[saveTibet]

Нет, я понимаю, что строка — это типа контейнера для самого текста. Если бы все было так хорошо, то при высоте строки 18px и кегле 18px текст занимал бы всю высоту блока. Ан нет, видим отступы. Более того, отступы не только по вертикали, но и погоризонтали. Как на скриншоте в предыдущем сообщении.


Из-за этого становится очень сложно выравнивать текстовые блоки, особенно это касается мелких элементов.

[Иван Желудков]

saveTibet: Как говорит гугл, высота кегля включает в себя небольшой отступ над и под буквой. То есть при кегле 18px текст не будет иметь «физическую» высоту 18px. Можно посмотреть как ведет себя текст в верстке: https://codepen.io/Vany/pen/xrjwyr



Полагаю речь идет о привычке считать все расстояния физически после фотошопа? А почему не считать как браузер? Или в типографике все расстояния считают от «физических» пикселей? Вроде бы нет.

[saveTibet]

Иван Желудков: я просто хочу понять, как Скетч рендерит шрифты и как с этим жить. Перфекционизм выравнивания по 8px-сетке подталкивает к тому, чтобы разобраться с тем, как правильно настраивать блоки текста.

Хм, а что за заплечики такие... Я впервые слышу такое понятие и по картинке непонятно, что это за пространство такое. Может, имитация креплений пуансонов?

[saveTibet]

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