Как вы боритесь с дополнительными отступами в типографии?

Question

[Сергей]

При использовании шрифта для правильного отступа приходится писать line-height. Есть ли способ сделать шрифт без отступов?

Answer 1

[Antony Bark]

поясните термин "отступы", line-height это межстрочный интервал. А лучше киньте пример сюда )

Comments

[Сергей]

Добавил картинку

[Antony Bark]

Судя по картинке, у вас речь не об межстрочном интервале line-height. А именно о отступах блока в целом. Т.е. о тексте в каком-то блоке <p><quote> и т.п. В таком случае, вам стоит указывать отступы для блока через padding и margin.
На inline элемент, которым и является текст, не влияют padding и margin. Если хотите к какой-то части теста применить отступы, то вставьте эту часть в блок, отличный от display: inline.
Пример:

<style>
span {
    display: inline-block;
    margin: .5em;
    padding: .5em;
    font-size: 16px;
    line-height: 1;
    background: gray;
  }
</style>

Свойство line-height определяет высоту одной строки текста (содержимое). Свойства padding и margin влияют на отступы от содержимого до края блока. <span>line-height влияет на высоту строки в любом случае.</span> Если текст находится не в блоке или для блока установлено display: inline то padding и margin не влияют на отступы по высоте, кроме background. Попробуйте в этом примере отключить свойство display: <b>inline-block;</b>

[Antony Bark]

Вроде, как у вас на картинке https://codepen.io/tolfy/pen/pVLLXG подходит? Проблема в реализации расчета величины верхнего и нижнего отступа у блока, я не владею JS, потому поставил примерно. Если базовую линию, для обрезания низа блока, как-то можно найти и контролировать, например через vertical-align, то верхний обрез не представляю как достать .. через first-line..

up Обновил. Чтобы выдержать стиль, как у вас на картинке и при любых *size, предвижу гемор с позиционированием, шаг вправо-влево - расстрел