Блокировка элементов ввода в Firefox

Question

Я пытаюсь заблокировать элемент CSS на двух сторонах его контейнера. Следующий CSS работает для таких элементов, как div, но не для элементов ввода в Firefox

left: 20px; Право: 20px; верх: 20px; высота: 20px; ширина: авто; позиция: абсолютная;

Я обнаружил, что могу обернуть элемент в DIV, но это не вариант, поскольку в моей ситуации это очень непрактично.

Answer 1

Вы пробовали следующее?

width: 100% 

Согласно w3schools, он должен быть расширен до содержащего элемент.

Answer 2

width: auto Причина не работает для input с в Mozilla потому, что они имеют внутреннюю ширину, которая устанавливается с помощью атрибута size, по умолчанию 20, когда атрибут не объявлен.

Я не вижу в этом легкого пути. Обычным способом, совместимым с кросс-браузером, является оболочка div с разницей, а затем установка ширины div в 100% внутри этого. Это также необходимо для IE6, который не поддерживает абсолютное позиционирование по краям (установка влево и вправо, но не ширина, или верхняя и нижняя, но не высота) для любого элемента.