min-width, max-width, min-height, max-height

Автор: Aport Вторник, Январь 27th, 2015 Нет комментариев

Рубрика: Разное

min-width, max-width, min-height, max-height

Узнаем как задать значения минимальной или максимальной ширины и высоты

Суть проблемы

Браузер Internet Explorer не понимает свойства css min-width, max-width, min-height и max-height.

Решение проблемы

Вот так задаем блоку:

минимальную ширину, например 222 пикселов:

#block {
min-width: 222px; /* для нормальных браузеров */
     width:expression(document.body.clientWidth > 222? «100%» :»222px»); /* для ie */
}

максимальную ширину, например 555 пикселов:

#block {
max-width: 222px; /* для нормальных браузеров */
     width:expression(document.body.clientWidth > 555? «555px» : «auto»); /* для ie */
}

минимальную 222 и максимальную 555 ширину сразу, одновременно:

#block {
min-width: 555px; /* для нормальных браузеров */
max-width: 555px; /* для нормальных браузеров */
width:expression(document.body.clientWidth < 222? «222px» : document.body.clientWidth > 555? «555px» : «auto»); /* для ie */
}

минимальную высоту, например 111px:

#block {
min-height: 111px; /* для нормальных браузеров */
     -height: 111px /* для ie6 достаточно этого, т.к. он воспринимает свойство «height» как min-height */
min-height: 111px;
height:auto !important;
height:111px; /* последние 3 строчки — для ie7 */
}

Сопутствующие неприятности

Даже при использовании трюков с min-width ie 6.0 не всегда правильно отображает блок при изменении размеров окна. Тем не менее при открытии или обновлении страницы всё выглядит так, как надо. Так что будем считать этот хак работающим.

 

Источник: yapro.ru

Оставить комментарий

Чтобы оставлять комментарии Вы должны быть авторизованы.

Похожие посты