Roboto с 14px дает разные размеры Chrome / Firefox - PullRequest
Новая
       104

Roboto с 14px дает разные размеры Chrome / Firefox

0 голосов
/ 14 января 2019

Я обнаружил странное явление проклейки. Элемент <input> в следующем фрагменте приводит к различному height с Chrome и Firefox только с font-family:Roboto и font-size:14px.

Когда я устанавливаю font-size на 15 пикселей или использую другой шрифт, все кажется нормальным и остается на height:35px

<ч /> 

<html>

<head>
  <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet" />
  <style>
    input {
      font-family: Roboto;
      font-size: 14px;
      padding: 8px;
      border: 1px solid black;
      margin: 0;
    }
  </style>
</head>

<body>
  <input type="text" value="this is a test" />
</body>

</html>
<ч />

13 "MacBook Pro (2017 - Мохаве 10.14.2):

  • Внешний 25-дюймовый экран Dell U2518D:
    • Firefox: height:35px
    • Хром: height:34px
    • Safari: height:34px

15 "Ноутбук HP Windows 10:

  • Хром: height:35px
  • Firefox: height:35px
  • Край: height:34.8px
<ч />

Может кто-нибудь объяснить разницу в 1px между Chrome и Firefox на Mac? Или разница в 1px между Chrome на Mac и Chrome на Windows?

И почему это происходит только с размером шрифта 14px?

Отредактировано: попытался уточнить вопрос

...