Как заставить Firefox отображать текстовое поле заполнение так же, как в div?

Я пытаюсь обеспечить одинаковую ширину каждой строки в пикселях внутри текстового поля в IE8, Firefox и Safari, чтобы текстовое содержимое обтекало строки как можно более предсказуемо и последовательно.

Firefox что-то делает немного странно: у него есть дополнительный пиксель заполнения, который съедает пространство содержимого текстовой области по сравнению с двумя другими браузерами и по сравнению с аналогичным оснащенным блоком div.

При применении этого класса как к текстовой области, так и к div, разница видна: текст в div касается внешнего левого края красного фона, но текст в текстовой области имеет смещение в 1 пиксель, подобное заполнению, несмотря на то, что заполнение равно нулю:

.testbox{
    padding:0;
    margin:0;
    border:0;
    background: red;
    width: 40px;
    height: 40px;
    font-size: 12px;
    line-height: 16px;
}

Другие значения для заполнения заканчиваются отображением одного дополнительного пикселя смещения по сравнению с div.

Любые идеи о том, есть ли способ обмануть Firefox, чтобы отобразить текстовое поле, как если бы это был div, или настроить это не-заполнение -but-look-like-padding для текстового поля?

5
задан Greg Borreson 7 December 2010 в 08:10
поделиться