Обычно IE5-IE8 не поддерживают CSS3 медиа запрос. Хотя данная возможность очень важна для кросс-браузерного веб-дизайна. Здесь я расскажу вам, как можно решить вопрос CSS3 медиа запросов для IE. Этот урок, поможет создать динамически изменяемую разметку в зависимости от разрешения экрана.
Для этого воспользуемся JavaScript библиотекой css3-mediaqueries.
Как подключить?
Скачайте и подключите скрипт между тегов HEAD следующим образом:
<!--[if lt IE 9]> <script src="/здесь измените путь к скрипту/css3-mediaqueries.js"></script> <![endif]-->
Как использовать?
Добавьте новые правила в таблице стилей:
@media screen and (min-width: 1000px) { /* Тут необходимо поместить набор CSS правил, которые будут применены, если разрешение экрана станет больше 1000px */ }
Как применять скприпт в дальнейшем, ограничено только вашей фантазией.
Примечание:
Поддерживаются и более ранние версии IE 5+.
Данный скрипт не работает с @import’ированными стилями.
Используйте только оператор ‘and’ (‘or’ не поддерживается).
Ссылки по теме:
css3-mediaqueries
W3C Media Queries