Как исправить рендер шрифтов в браузерах различных ОС?

Question

[Aeooe2]

Давно бьюсь с проблемой:
1) Некоторые ( а скорее многие) шрифты рендерятся в браузерах на различных ОС (win, mac, android) по разному и часто радикально по разному - это вызывает серьёзные проблемы в верстке.
Обычно строка "съезжает" с привычного места - т.е. символ в высоте строки находится или выше или ниже привычного (на другой ОС)

Пример скрина с Android (на десктопе Windows все хорошо):

Как правильно решать такие проблемы? Может есть набор проверенных шрифтов, которые идентично рендерятся? Может нужна какая-то подготовительная работа для использования шрифта?

Comments

[Антон Литвиненко]

конкретно тут проблема не рендера, я думаю тут задана высота инпута, и дальше копать в сторону стилей

[Lynn «Кофеман»]

Есть два проверенных шрифта: serif и sans-serif.

Но в среднем любые другие нормальные шрифты рендерятся нормально.

Так что разбираться надо с конкретными глюками конкретного шрифта в конкретной вёрстке.

[Aeooe2]

Антон Литвиненко, Не нашел где там может быть высота. если подкидываю другой шрифт - проблема решается.

Искусственно делал input большой высоты - проблема не решалась.

[Антон Литвиненко]

Aeooe2, не могу прикрепить скрин с мобилку, в мобильном хроме все ок

[Юрий]

На моём андроиде всё ок. Что у вас там за браузер?

[Aeooe2]

Я уже другой шрифт подкинул. Поэтому уже хорошо выглядит.

[Антон Литвиненко]

Может быть еще проблема в дефолтных стилях для инпутов. Буквально вчера обнаружил что на мобилке селекты серые вместо белых и таки да, только принудительно задать белый убирает какойто там серый по умолчанию. на десктопе при этом все норм

[yarovikov]

Это просто косяк верстки, рендеринг ни при чем