Это потому, что у элемента формы есть немного другие правила относительно того, как width, padding и border-width влияют на их окончательную ширину, как показано на экране. «Правильный» способ исправить это - сбросить блочную модель, используемую этими элементами формы, на модель, используемую каждым другим элементом, со свойством box-sizing
:
dl > * > * {
-ms-box-sizing: content-box;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
См. Это демо: http://jsfiddle.net/9dGkk/1/ и это Сообщение Quirksmode для получения дополнительной информации