У меня была эта проблема в течение многих лет, и раньше я видел подобные вопросы, но никто из них не обратил внимание на то, что при установке width: 100% на элементах - paddings, поля и границы будут увеличивать ширину.
Посмотрите на Fiddle.
Белым верхним текстовым полем является стандартное текстовое поле с шириной, установленной на 100%. Как вы видите, он переполняет его родительским из-за настроек полей, дополнений и границ.
Зеленое текстовое поле оформляется как div с помощью position: absolute. Это похоже на мечту в браузерах webkit, но нигде больше.
Красный div - это элемент управления - я хочу, чтобы входной сигнал действовал точно так же.
Есть ли какие-либо хаки/трюки, которые я могу использовать, чтобы мои текстовые входы действовали так же, как красный div во всех современных браузерах, другими словами, вписывались в дополнение к родительскому элементу? Измените мой скрипт или создайте свой собственный, чтобы сопровождать ваш ответ. Спасибо!
