React.js - Bootstrap / Reactstrap - z-index не работает на Carousel

#reactjs #bootstrap-4 #carousel #z-index #reactstrap

#reactjs #bootstrap-4 #карусель #z-индекс #reactstrap

Вопрос:

Я хочу, чтобы моя фиксированная панель навигации, которая остается в верхней части страницы, отображалась поверх всего, когда я прокручиваю страницу вниз, но когда я прокручиваю вниз, карусель заканчивается поверх панели навигации.

Я пытался присвоить z-index: 0 с тегом !important карусели, а z-index: 1 навигационной панели, но это не помогло. К проблеме, о которой я говорю, прилагается фотография.

1. Я думаю, что изображения имеют высокое значение z-индекса. Увеличьте z-индекс панели навигации

2. Я поместил z-индекс в контейнер панели навигации, а не в фактическую панель навигации. Вот почему это не сработало. Спасибо!

Ответ №1:

дайте zindex фиксированной панели навигации некоторое более высокое значение, например z-index: 1090

Я оборачиваю панель навигации в липкий div:-

 <div className="sticky-top" style={{ zIndex: 1090 }}>
    <Navbar></Navbar>
</div>

Кстати, я использую react-bootstrap.

Ответ №2:

Я смотрю на свои свойства CSS заголовка. Мой заголовок имеет z-индекс: 1. Фиаско. Измените его на 1090. Это поможет вам.

Проверьте все элементы, которые были переполнены галереей. Проверьте их все!!!(z-индексы)!