IE6 минимальная высота дилемма

Question

Вот мой сайт: http://smartpeopletalkfast.co.uk/ppp/home-page.html

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

Проблема в том, что IE6 не распознает минимальную высоту.Я мог бы установить фиксированную высоту, но я беспокоюсь о том, что пользователи могут изменить размер текста.Поскольку это всего лишь косметический вопрос, мне хочется просто оставить это.

Есть предложения?Спасибо

Answer 1

Если проблема действительно только что min-height работает в IE6, используйте Min-Height Fast Hack :

selector {
    min-height:500px;
    height:auto !important;
    height:500px;
}

Он существует уже давно, поэтому его легко узнать любому, кто будет поддерживать ваш CSS в будущем.

Answer 2

В Internet Explorer 6 height рассматривается как min-height, а min-height не поддерживается.

Таким образом, вы можете написать правило, предназначенное только для IE6, чтобы исправить это.Допустим, у вас есть следующее:

#navigation .nav-menu-item {
    min-height:50px;
}

Чтобы иметь тот же эффект в IE6, вы можете добавить второе правило, которое распознает только IE6.Я склонен использовать взломать HTML-звезду :

#navigation .nav-menu-item {
    min-height:50px;
}
* html #navigation .nav-menu-item { /* for IE6 */
    height:50px;
}

Вы можете прочитать больше здесь .

Answer 3

Позвольте мне предложить другой подход.Это ваша цель, как указано:

Я хочу, чтобы формы ввода имели ту же высоту, что и кнопки справа от них.

Плюс, есть условиес учетом изменения размера текста, как указано:

все еще можно использовать, если размер текста был установлен больше этой высоты

Зная это, я предлагаю основать высотуна ЭМ.Используйте EM для определения высоты контейнера входа и кнопки, затем установите высоту входа и кнопки равными 100%.Таким образом, когда пользователь сбрасывает размер шрифта (с наименьшего до наибольшего), контейнер будет увеличиваться и уменьшаться, а кнопка ввода / будет увеличиваться и уменьшаться вместе с ними.

Я смоделировал простой примерпо следующему адресу: http://jsbin.com/oguze5/2/edit

В стилистике нужно что-то менять, но общая идея / концепция довольно здравая.

Answer 4

Спасибо за ваш пост.Я видел это решение вокруг, но оно не сработало для меня, оно установило фиксированную высоту, а не минимальную.

Я сделал это с помощью приведенного ниже решения и загрузил CSS для IE6 только для хорошей оценки.Он работает на компьютере, на котором я его проверил. Надеюсь, он работает на всех компьютерах IE6:

http://perishablepress.com/press/2007/01/16/maximum-and-minimum-height-and-width-in-internet-explorer/

Спасибо