У меня есть проблема. Есть такой код:
.hover {
width: 100%;
background: red;
height: 50px;
position: absolute;
top: 0;
left: 0;
}
.hover:hover {
height: 100px;
}
select {
margin-top: 50px;
}
<div class="hover"></div>
<select name="" id="">
<option value="">123131231232131</option>
<option value="">131231231312122</option>
<option value="">31231313131313</option>
<option value="">13131313131314</option>
<option value="">51232131313123</option>
</select>
Если навести на верхний блок, он увеличивает высоту и перекрывает select. Но, если открыт список option-ов, он перекрывает этот блок. Как это можно исправить?
P.S. z-index для этого не подходит
Upd: Исправить то, что список option-ов над блоком hover, необходимо что бы он был под ним
Upd2: Сейчас это выглядит так
Необходимо что бы список option-ов был под блоком
z-index
? – Евгений Николаев 24 окт '18 в 7:21