Задать вопрос

Как правильно выравнивать шрифт по макету(пример внутри)?

Добрый день ! Имеется макет вот такой:
5e09fa712fd18537288829.png
Стрелочка 1 - базовая линия шрифта.
Стрелочка 2 - line-height, который к сетке отношения не имеет.
Сетка в макете 4px и 20px. Выравнивание шрифта у дизайнера по нижней границе текста.
Я ума не приложу как такое выравнивание сделать ?
  • Вопрос задан
  • 352 просмотра
Подписаться 2 Простой 2 комментария
Помогут разобраться в теме Все курсы
  • Яндекс Практикум
    Профессиональная вёрстка на HTML и CSS
    3 месяца
    Далее
  • Stepik
    Основы HTML и CSS
    2 недели
    Далее
  • OTUS
    HTML/CSS
    3 месяца
    Далее
Пригласить эксперта
Ответы на вопрос 3
mixail_fet
@mixail_fet
Дизайнер веб-интерфейсов
Почему line-heigh не имеет отношение к сетки? Отступы отсчитываются по линии шрифта, которая генерируется автоматически, по размеру line-heigh.

5e09fe0c66c19454760893.jpeg
Ответ написан
Можно выровнять так align-items baseline
Главное что бы контейнер был display flex
Ответ написан
Комментировать
tilion
@tilion
Веб-дизайнер
Это неряшливость дизайнера или закравшаяся случайно неточность. Достаточно округлить. По умолчанию та же Фигма ставит текстовые объекты по пиксельной сетке, включая базовую линию.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы