Можно ли стилизовать текстовый ввод, чтобы заполнить ширину его родителя? ⇐ CSS

[Anonymous]

У меня была эта проблема в течение многих лет, и я видел подобные вопросы раньше, но ни один из них не касался того факта, что при установке ширины: 100% для элемента отступы, поля и границы будут увеличьте ширину.



Взгляните на эту скрипту.

Самое верхнее белое текстовое поле представляет собой стандартное текстовое поле с шириной, равной 100 %. Как вы можете видеть, оно переполняет родительский элемент из-за настроек полей, отступов и границ.

Зеленое текстовое поле оформлено как элемент div с использованием позиции: Absolute . Это работает как мечта в браузерах Webkit, но нигде больше.

Красный элемент управления — это элемент управления. Я хочу, чтобы ввод действовал именно так .



Есть ли какие-нибудь приемы/хитрости, которые я могу использовать, чтобы мои текстовые вводы действовали так же, как красный элемент div во всех случаях? Другими словами, современные браузеры помещаются внутри родительского поля? Пожалуйста, отредактируйте мою скрипку или создайте свою собственную, чтобы дополнить свой ответ. Спасибо!

Подробнее здесь: https://stackoverflow.com/questions/117 ... its-parent