Почему на андроиде выпадающее меню css работает, а на айфоне нет?
Почему на андроиде выпадающее меню на чистом css работает нормально, а на айфоне этот код не работает?
Как сделать чтобы он работал?
.dropdown__wrapper {
display: flex;
flex-direction: column;
position: absolute;
top: 38vw;
background-color: black;
font-weight: bold;
color: #F8E31A;
z-index: 3;
}
.dropdown__wrapper:hover > .dropdown__item {
display: flex;
}
.dropdown__wrapper:focus > .dropdown__item {
display: flex;
}
.dropdown__item {
text-align: start;
color: #F8E31A;
text-decoration: none;
white-space: nowrap;
display: none;
}
.dropdown__link {
font-size: 2.5rem;
line-height: 2.5rem;
width: 100%;
text-decoration: none;
color: #F8E31A;
padding: .3rem;
letter-spacing: .6rem;
}
.dropdown__link:hover {
color: black;
background: #F8E31A;
}
.dropdown__link:focus {
outline: none;
color: black;
background: #F8E31A;
}
<ul class="dropdown__wrapper"><a class="dropdown__link">наши достижения <span class="dropdown__arrow arrow"></span></a>
<li class="dropdown__item"><a class="dropdown__link" href="https://youtu.be/lbuHD-obfM4">чемпионат города 2023</a></li>
<li class="dropdown__item"><a class="dropdown__link" href="https://youtu.be/nyOZhTUFDN0">чемпионат края 2023</a></li>
<li class="dropdown__item"><a class="dropdown__link" href="https://youtu.be/c0OfV2ryEDM">чемпионат России 2023</a></li>
<li class="dropdown__item"><a class="dropdown__link" href="https://youtu.be/-laKT__5Q-c">чемпионат Европы 2023</a></li>
<li class="dropdown__item"><a class="dropdown__link" href="https://www.instagram.com/p/CmEAed9qu72/?igshid=MDJmNzVkMjY=">чемпионат Мира 2023</a></li>
</ul>
Источник: Stack Overflow на русском