Архив width

Максимальный размер картинок в IE

Posted in Разное with tags , , on 24 сентября 2008 by theifish

Иногда необходимо чтобы картинка была каких-то разумных размеров, и не вылезала за пределы экрана/блоки и прочее.

Для этого в CSS есть два прекрасных параметра для ограничения размеров: max-width и max-height, ограничение по ширине и высоте соответсвенно. Но, в недрах Microsoft решили, что CSS им не авторитет и забили на эти параметры, поэтому грустные пользователи IE смотрят разъежающийся дизайн и вылезающие за края картинки.

Но! Решение есть, как всегда не тривиальное:

width: expression(this.width > значение ? значение: true);
height: expression(this.height > значение ? значение: true);

Теперь, чтобы ограничить картинку размерами 400 на 400:

.mypicture {
  max-width: 400px;
  max-height: 400px;
  width: expression(this.width > 400 ? 400: true);
  height: expression(this.height > 400 ? 400: true);
}

Все счастливы.