Ошибка позиционирования в IE7 (залипание!)

Question

проверить эту страницу: http://jsbin.com/itufix с IE (страница автоматически включает режим IE7).

Здесь вы найдете примеры того, как встроенные элементы (input и span) отображаются как с блоком отображения. Все поля полей и отступов установлены на 0. Если вы используете инструменты разработчика для IE (IE8-9), вы могли заметить, что ввод показывает смещение: 1.

Может кто-нибудь объяснить, что на самом деле происходит и как это исправить?

ПРИМЕЧАНИЯ

1. Добавление float для ввода исправит это, но это не вариант. Мне нужно сделать это без поплавка.
2. Input / span и его свойство div parent имеет значение trueLayout!
3. Любая информация, связанная с этой ошибкой, приветствуется.

UPDATE: Вот еще примеры того, как используются стили: http://jsbin.com/itufix/13. Каждое поле может иметь описание под ним, плюс весь элемент div.form может плавать (в случае, если мне нужно более одного поля в строке)

Answer 1

Если вы не можете использовать input (почему?), Тогда вы можете сделать это:

*+html input {
    margin-top: -1px;
    margin-bottom: -1px;
}

http://jsbin.com/itufix/5

Используется CSS-хак , поэтому обходной путь применяется только в IE7.

Answer 2

Глядя на ваш CSS, я вижу следующее:

div.form-item{
    padding: 0 1px;
}

Изменение этого значения на padding:0;, кажется, удаляет все отступы на полях формы для моих глаз.См .:

http://jsbin.com/ojeros/2/

Или я что-то упустил?