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!

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


Need some help figuring out this dropdown menu item

I am working on a basic drop down menu, but I've run into an issue. As soon as I hover over the "food menu" element, the sub menu items block the entire element. Does anyone have a suggestion as to how I can fix this?

My apologies, here is a link to the codepen


1 Answer

David ODey
David ODey
11,744 Points

On line 58 of your pen, add a top of 50px. This will fix your issue.

nav ul li:hover > ul { display: inherit; top:50px }

Thank you David ODey! I stared at that line a few times and for some reason it never dawned on me. Great job!