Подтвердить что ты не робот

Почему элемент <input> теряет левое/правое поле при заданной ширине?

Следующее:

<!DOCTYPE html>
<form>
    <input type=text>
</form>

Создает следующую модель окна в Chrome:

box model no width

Однако, если тип ввода имеет ширину:

<!DOCTYPE html>
<form>
    <input type=text style="width: 100px;">
</form>

Левое и правое поле удаляются:

enter image description here

Почему это?

4b9b3361

Ответ 1

"Цель внутренних полей - попытаться предотвратить смещение соседних элементов управления друг против друга. Особенно с закругленными элементами управления это выглядит ужасно. Причина, по которой вы видите изменение значений, состоит в том, что мы устанавливаем только собственные поля, когда мы думаем, что она выиграла 't нарушить компоновку страницы. Если автор задает явную высоту/ширину элемента управления, мы предполагаем, что дизайнеру требуется точное управление пикселем, поэтому мы отключаем поля, чтобы не нарушать макет страницы."

https://code.google.com/p/chromium/issues/detail?id=128306#c20