Как сделать так, чтобы выпадающие списки оставались на переднем плане с помощью Bootstrap 4, составленных с фиксированными верхними панелями навигации?
На странице Bootstrap 4 я пытаюсь создать пару фиксированных верхних панелей навигации с <iframe> под ними, заполняя оставшееся пространство. Он работает хорошо, за исключением одной проблемы: раскрывающиеся списки в верхней панели навигации появляются под нижней панелью навигации.
Эта страница воспроизводит проблему. Вот результаты при просмотре в Firefox 63 и Chromium 70:
(прошу прощения за темный текст на темной панели навигации за бит «Здесь все идет»)
Я предполагаю, что мне нужно внести некоторые корректировки zindex или что-то подобное, но я не уверен, зачем это нужно (не должны ли обе панели навигации уже иметь один и тот же индекс Z?) И как.
Ответы 2
Вы можете установить z-index на fixed-top-2 ..
.fixed-top-2 {
z-index: 99;
}
Добавьте z-index для класса .fixed-top-2, и вместо использования margin-top вы можете использовать top.
.fixed-top-2 {
/* margin-top: 62px; */
top: 62px;
z-index: 90;
}