monochromer
@monochromer

Как пофиксить отступ в кнопках для Chrome?

Всем привет!

Есть кнопки с кодом (еще подключен normalize 3.0.2)
button {
  display: inline-block;
  vertical-align: middle;
  box-sizing: border-box;
  padding: 0;
  height: auto;
  line-height: 1;
  border: 2px solid #39f;
  text-transform: uppercase;
  background: #fff;
}

Пример
10a53666ee5b48eca2dc1a9a85969493.png

Для Chrome снизу кнопки появляется дополнительный отступ. Как можно поправить?
  • Вопрос задан
  • 246 просмотров
Решения вопроса 1
iiiBird
@iiiBird Куратор тега CSS
Пока ты спишь - твой конкурент совершенствуется
никак. браузеры рендерят шрифты каждый по своему.
Ответ написан
Пригласить эксперта
Ответы на вопрос 4
alexfilus
@alexfilus
Senior backend developer
Особенно с нестандартными шрифтами такое часто бывает. Можно подобрать font-size и line-height при которых всё встанет ровно, но если важно соблюсти размеры из макета, то это проблема.
Ответ написан
sayber
@sayber
Да, я программирую на PHP и еще асинхронно!
monochromer: Делайте под хром в первую очередь, если не возможно реализовать одинаково под все браузеры и тем более платформы.
Разница windows и osx тоже имеет место быть.
Ответ написан
Комментировать
dom1n1k
@dom1n1k
Никак. Базовая линия плавает в разных браузерах и осях.
Если принципиально нужно выровнять всё до пикселя с абсолютной кроссбраузерностью, то единственный выход - сделать кнопку картинкой.
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы