Firefox обрезает ввод текста снизу букв

Question

Пропуск ниже букв, таких как g, y, j, обрезается только в Firefox 3.6.

<input type="text" value="yyyy gggg xxxx" style="height: 1em;" />

http://jsfiddle.net/mrtsherman/yqTjX/

Мой гугл-фу меня полностью подводит. Простая проблема. Я думаю, что есть простое решение.

Answer 1

1em представляет ширину строчной буквы M в данном шрифте, поэтому я понимаю. 1em не обязательно будет иметь достаточную высоту для отображения полного символа. Из-за различий в отображении шрифтов между браузерами (особенно Firefox и Safari) вы можете заметить незначительные различия в этих направлениях. Либо уберите высоту (чтобы она автоматически рассчитывалась), либо увеличьте размер. Красиво и просто.

Answer 2

не используйте em для определения размера ввода, тогда вы можете изменить размер шрифта, чтобы удовлетворить.Если вы устанавливаете размер через em, поле всегда будет основано на размере шрифта, оно наследуется.

1em обычно (не всегда) всегда эквивалентен 16px, если настройки по умолчанию для браузера пользователя установлены по умолчанию или будут основаны на настройке размера шрифта, установленной ранее на листе. Найдите эквивалент вpx для ваших клиентов, а затем уменьшите размер шрифта для этих входных данных на 3-4 пикселя, чтобы можно было использовать спуски и спуски

input {  
    height: 16px;
    width: 100px;
    font-size: 13px;
}