то есть ошибка позиционирования в div

0

У меня есть DIV с абсолютным положением, содержащим поле INPUT, мне нужно, чтобы этот вход был центрирован по вертикали и горизонтали внутри div, который я выполнил с отображением: блок и выравнивание текста, проблема в том, что свойство width не работает одинаково путь для IE (10 и ниже), родительский div имеет правильную ширину в chrome и firefox, но совершенно другой в IE10,9 и 8.

На всякий случай эта информация имеет значение, родительский div находится внутри другого div с относительным положением. Я знаю, что это звучит как вопрос из будущего в будущее, но я был очень удивлен, заметив, что это все еще имеет этот вопрос после нормализатора и т.д.

Здесь код HTML и CSS

<div>
    <input type="text" />
</div>

div {
    position:absolute;
    background: blue;
    width: 180px;
    padding:8px 0;
    display:block;
}

input {
    border-radius: 5px;
margin: 0;
height: 20px;
position: relative;
display: block;
margin: 0 auto;   
}
  • 0
    Какая версия IE?
  • 0
    @Andrei Андрей IE10, но у меня та же проблема с предыдущими версиями тоже
Показать ещё 4 комментария
Теги:
input
width

1 ответ

0

Проблема вызвана единицами em.

Если вы сравните IE и Chrome, вы увидите, что зеленая панель в меню больше в IE, чем в Chrome. Это потому, что разница между пикселями здесь и там в размере шрифта.

Они вычисляются по-разному. Я думаю, что IE приближается по-разному.

Возможно, вместо того, чтобы заставить 2 браузера выглядеть одинаково, вы можете сделать его хорошо выглядящим в обоих браузерах. Пользователи не будут знать.

Используйте либо CSS файл, который добавляется в IE-браузерах, либо обнаруживает браузер с помощью javascript и добавляет классы в тело (аналогично модернизму), либо использует хаки CSS.

  • 0
    Что бы вы порекомендовали сделать Андрею? Основной шрифт моего тела - в пикселях, остальные шрифты - относительно этого шрифта (16 пикселей). Это означает, что мы просто должны прекратить использовать ems, если нам нужно, например, скрещивать? Кстати, ширина ввода не помогла.
  • 0
    Я не рекомендую это. em единицы должны быть в порядке. Возможно заполнение, рассчитанное как em-единицы, тоже является настоящей проблемой.
Показать ещё 3 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню