Задать вопрос
Odinokun
@Odinokun
html

Как поддержать vh и vw в старых браузерах, или как заменить vw/vh на 100%/auto?

Доброго времени суток.
Есть страничка сайта которая состоит из одного единственного слайдера.
Слайдер растягивается на всю высоту и ширину в зависимости от разрешения экрана.
Размеры задавались через 100vh и 100vw.
В старых браузерах ниже чем firefox 18, Chrome 19, Opera 12, IE8, Safari 5 и т.п. эти единицы не поддерживаются.
Какой костыль можно использовать для хоть какой-то поддержки этих единиц в старых браузерах?

Или в крайнем случае как сделать так, что бы если эти единицы не поддерживаются, то ширина слайда становилась 100% вместо 100vw, а высота становилась "auto" вместо 100vh?
  • Вопрос задан
  • 2022 просмотра
Комментировать
Подписаться 3 Оценить Комментировать
Решения вопроса 1
dzhiriki
@dzhiriki
Полифил это хорошо, но работает он весьма медленно, поэтому лучше стараться не полифилить такие вещи.
Для фоллбека до процентов можно использовать простую конструкцию:
width: 100%;
width: 100vw;
height: auto;
height: 100vh

Если браузер знает vw \ vh, то предыдущея строчка перекроется. Если не знает, будет использовать первую с процентами \ auto.
Ответ написан
2 комментария
2 комментария
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Frontend-разработчик (React)
ДАЛЕЕ
от 130 000 ₽
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Дизайнер, сделать монетизацию для Web расширения
19 апр. 2024, в 16:08
10000 руб./за проект
Очистка ин.текста с изображения и создание обложки+корешка для книги
19 апр. 2024, в 15:34
14000 руб./за проект
Разработать фронтенд для интернет-магазина на фреймворке TS
19 апр. 2024, в 15:33
60000 руб./за проект
Ещё заказы