CSS animation overflowing nav bar

Hey, I’m facing a problem as the title says, here are screenshots of the problem:
before the animation:

after (the scaling is overflowing my nav bar):

Here’s the link to my code: https://codepen.io/LittleGrayay/pen/wbqMqB
Any advice will be welcomed. Thanks in advance :slight_smile:

Set a z-index on the navbar (should just need z-index: 1). You need to tell it to sit higher on the z-axis that other things on the page.

I actually tried nav {z-index: 1}, but it didn’t work as expected somehow.

I just fixed the bug. After searching for so many sites, I figured out that z-index will only work if the elements have position attributes other than static.