Wyświetlanie rozwijanego sticky menu (problem z position: ... ;)

Question

Cześć!

Mam problem z prawidłowym wyświetlaniem rozwijanego sticky menu.

Kod wygląda tak:

.menu > ul > li > ul {
    margin: 0px;
    padding: 0px;
    display: none;
    width: 100%;
    top: 100%;
    position: absolute;
}
 
.menu > ul > li:hover > ul{
    display: block;
    animation-name: fadein;
    animation-duration: 1s;
}
 
@keyframes fadein
 {
    0% { opacity: 0; }
    100% { opacity: 1;}
}

I niby wszystko powinno grać... Ale z "position: absolute;" linki w pojawiającej się liście nie wyświetlają się: widzę tylko tło. Próbowałem coś kombinować z "z-index", albo wyświetlaniem samych linków (bo może lista się wyświetla, ale one z jakiegoś powodu nie dziedziczą "display"?), jednakże nic nie pomaga. Poza zamianą na "position: relative;" - wtedy wszystko działa prawidłowo, poza tym oczywiście, że inne bloki mi się rozjeżdżają na stronie, czego nie chcę.
Może warto jeszcze dodać, że samo .menu korzysta z "position: sticky;".
Za pomoc z góry dzięki :D!
 

Answer 1

Witam.

    top: 100%;
    position: absolute;

To znaczy, że twoje submenu pojawia się przyklejone do dołu body. Dlatego go nie widzisz. (jeżeli nie ma position: relative; dla przodka).

Daj cały kod to zobaczymy więcej.

Answer 2

Pan Mirosław Zelent w jednym z filmów na kanale pokazuje jak zrobić przyczepione menu