Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial


Brandon Brigham
Brandon Brigham
3,716 Points

Top main dropdown menu z-index issue


On the site I am working on my top primary dropdown menu is not working correctly.


If you hover over the brown top menu the drop-down elements go underneath the green sidebar menu. I can't seem to find which class or id to adjust to fix this. I'm pretty sure it's a z-index issue but nothing has seemed to work.

Thanks for any help!

Do you have this fixed already? I don't see it going under the green sidebar menu.

If it's fixed consider updating your title to include [Solved] so others know to skip it.

Brandon Brigham
Brandon Brigham
3,716 Points

It has been fixed. Thanks Jason!

2 Answers

Hey Brandon, I was going crazy with z-index last night. I noticed that the z-index of #secondary is 10. The z-index of, I believe, of the class "site-header" is 4. To see if that was the problem I change 4 to 1000, and the nav within .site-header was layered on top. Just ensure the z-index for .site-header is greater than #secondary.