@razum_04

Не работает z-index?

Здравствуйте, есть блок
<div class="man">
          <div id="first_desc">
            <h4>Заголовок</h4>
            <p>текст.</p>
          </div>
          <img src="img/bus.png" alt="" class="man cent" id="first">
        </div>

и
.man
		display: block
		img.man
		width: 200px
		position: absolute
		#first
			position: absolute
			top: $mt1 + px
			z-index: 0
		#first_desc
			margin-top: $mt1 - 40px
			background-color: #fff
			border-radius: 30px
			box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 1)
			// max-height: 60px
			overflow: hidden
			transition: all .2s
			max-height: 1000px
			z-index: 2

все $mt - рандомные числа
проблема в том, что текст под картинкой, а не надо чтобы он ее перекрывал
5c24807bc0f93453501348.png
z-index к нему применяется
5c2480d9bd093045612736.png
  • Вопрос задан
  • 120 просмотров
Решения вопроса 1
Vlad_IT
@Vlad_IT
Front-end разработчик
Чтобы применить z-index, нужно чтобы блок был не position: static, а position: absolute/fixed/relative/sticky. Добавьте
position: relative;
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
mironovbam
@mironovbam
Фронтендер
Хоть ответ уже предоставлен, я дам ещё один маленький совет. Не вешайте на элементы div свойство display: block. div по умолчанию в браузерах является блоком.
Ответ написан
bubandos
@bubandos
bash'у, javascript'ую, php'лю, css'аю, html'каю
экстрасенсы ушли на каникулы.
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы