Weinaum
Silver Member | Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Приветствую, подскажите, как бы грамотнее всего центрировать текст по вертикали, чтобы текст всегда находился на воображаемой средней линии текста?
В svg для этого есть свойство alignment-baseline, а как быть если текст html?
Применительно, скажем, в такой задаче - если размер шрифта динамически изменяемый
Если текста только одна строка, то выход найти легко, как пример:
Пример 1
слева - html, справа - svg.
Тут все более менее похоже, flex и одна строка по центру.
А вот пример с тремя строками - и я хочу расположить строки в строго определенных местах и центрировать их так же как в случае с svg, чтобы они не разлетались кто куда.
Пока в голову приходит только абсолютное позиционирование для каждой строки, с line-height 12.5% от высоты общего контейнера(в моем случае line-height 25px и топ для каждой абсолютно позиционируемой строки 37.5, 87.5 и 137.5 px.
Не знаю, насколько правильное решение, может есть более корректное или грамотнее и проще можно сделать?
|
Всего записей: 2155 | Зарегистр. 18-06-2006 | Отправлено: 00:29 20-11-2020 | Исправлено: Weinaum, 08:54 20-11-2020 |
|
