Страницы

Поиск по вопросам

понедельник, 29 октября 2018 г.

@media запросы не работают в IE c % / vw / vh

#window.floors, #window.apartments { @media (max-width: 140vh) { ... } }
В ie 11 и ниже не пашет. В Safari, FF, Chrome (последних) все окей. Пробовал добавлять тип экрана all, screen, - тоже не спасло. Если заменить на пиксели, то все ок. Но нужны именно динамические единицы :)
Пример:
index.html

This is TEEEEXT!


main.css
html, body { margin: 0; padding: 0; }
#window { position: relative; height: 100vh; width: 100%; }
#window.apartment { display: flex; flex-flow: column nowrap; align-items: center; justify-content: center; }
#window.apartment span { font-size: 20px; }
@media (max-width: 140vh) { #window.apartment span { font-size: 40px; } }


Ответ

Для этого используется специальная библиотека - viewport-units-buggyfill
Просто подключите библиотеку в конце html страницы:

Комментариев нет:

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