Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS

Brandon Brigham
Brandon Brigham
3,716 Points

Top main dropdown menu z-index issue

Hi,

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

http://www.villa-terrazza.com/2014NewSite/

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.