Полоска для управления iPhone наезжает на fixed-блок в браузере
Вижу вот такую картину на своём сайте:
Возникла идея добавлять блоку border-bottom, когда полоска айфона отображается. Подскажите, как можно детектить состояние этой полоски? Может есть js-библиотека какая-нибудь?
Ответы (1 шт):
Автор решения: Ein
→ Ссылка
Для данной полоски и моноброви в css есть safe-area-inset-top, и safe-area-inset-bottom(а ещё safe-area-inset-left и safe-area-inset-right).
В коде это буде выглядеть как-то так:
.bottom_line_selector {
/* второе значение будет взято если safe-area-inset-bottom отсуствует */
padding: env(safe-area-inset-bottom, 5px);
}