Неправильно выровненные раздвижные двери в IE7

У меня есть веб-приложение, изначально предназначенное для IE7. Я перенастраиваю CSS, чтобы сделать приложение презентабельным в последней версии Chrome, не ломая его для пользователей IE7. Я исправил неправильно выровненные поля ввода раздвижной двери по всему сайту, но есть одна страница, на которой я не могу заставить раздвижную дверь выровняться как в IE7, так и в Chrome. Настройка очень проста:

<span>
    <input type="text" ... />
</span>

В этом случае пролет удерживает левую заглушку сдвижной двери, а вход удерживает правую заглушку и корпус. Я стилизовал и span, и input как встроенный блок с одинаковой высотой и без полей или отступов. Chrome делает это, и это выглядит великолепно, но IE7 отображает ввод на 1 пиксель ниже, чем диапазон, например:

нужно больше репутации для публикации изображений

Если я добавлю к входным данным -1px верхнего поля, то IE7 отобразит это правильно, а Chrome отобразит его смещенным. Я пытался сравнить этот экземпляр со всеми другими входами для раздвижных дверей в приложении, которые работают как в IE7, так и в Chrome, но я не могу понять, что здесь отличается....

Кто-нибудь сталкивался с такой проблемой раньше?


person busoni34    schedule 20.07.2011    source источник


Ответы (1)


Почти наверняка есть лучший способ исправить это, но не видя этого.

Добавьте class к сломанному input, например "ie7fix", затем:

/* applies to only ie7 */
*+html .ie7fix {
    margin-top: -1px; 
}

http://en.wikipedia.org/wiki/CSS_filter#Star_plus_hack

person thirtydot    schedule 20.07.2011