Проблема возникает только в input[type="text"]
в Webkit. Независимо от того, что я делаю, в элементе есть эквивалент дополнительного padding: 1px 0 0 1px
(только сверху и слева).
Аналогичная проблема возникает в Gecko, input[type="text"]
имеет эквивалентную дополнительную padding: 1px 0 0 1px
и input[type="button"]
имеет дополнительный padding: 1px 0 0 0
.
Здесь JSFiddle показывает вам все, что я пробовал, и ничего не работает: http://jsfiddle.net/PncMR/10/
Интересно, что когда вы устанавливаете высоту строки всех элементов на 0
(http://jsfiddle.net/PncMR/11/), единственными незатронутыми элементами являются те, у кого проблемы, поэтому я предполагаю, что браузер по умолчанию использует определенную высоту линии, и теперь я ищу способ переопределить его.
Я не нашел ничего в базовых стилях webkit, которые бы это сделали, но не стесняйтесь проверить себя:
http://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css
Это не проблема moz-focus-inner
или проблема с appearance: none
, либо проблема box-sizing
, либо проблема outline
, и я не могу найти никаких других решений.
Изменить: см. мой ответ ниже для вертикальных проблем заполнения, но Я все еще ищу решение для дополнительного эквивалента padding-left: 1px
на текстовых входах только в webkit и gecko. (http://jsfiddle.net/PncMR/14/)