CODEWITHSUNDEEP
htmlcsstransformz-index
nordcode
nordcode

Reputation: 3

CSS dropdown menu hides behind content (z-index not working due to transform)

I'm working on developing a submenu with dropdown but when the menu is expanded, the content hides below the next grey content section. I also tried to set the z-index of the expanding ul-element to e. g. 999999, but it hides anyway.
I assume it might be related to the transform function of the ul-element which has its own stacking rules, but I have no clue how to resolve it. Any hints would be very helpful.

.c-serviceMenu--active ul {
    visibility: visible;
    opacity: 1;
    transform: translateY(-1px);
    transition-delay: 0s;
    z-index: 999999;
}

JSfiddle https://jsfiddle.net/umpg89jo/7/

Thank you.

Upvotes: 0

Views: 1284

Answers (1)

Aman Sharma
Aman Sharma

Reputation: 964

remove overflow: hidden; from section

Upvotes: 2

Related Questions