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

CSS

Posted by troy beckett
troy beckett
12,035 Points

css drop down menu:

please take a look at my codepen:

http://codepen.io/tbeckett24/pen/XJZGqp

what do I need to add to the code to make the sub-menu appear only when I hover over the main menu artist link. My mid is going blank.

So basically what code do I now add to turn this into a simple drop down menu.

1 Answer

Brandon Barrette
Brandon Barrette
20,485 Points
Brandon Barrette
Brandon Barrette
20,485 Points

So what you want to do is hide the .sub-menu. Then you want to a CSS rule that says when you hover over the anchor tag, display:block the next element (which is your .sub-menu)

#main-menu > li > a:hover + .sub-menu {
  display: block;
}
troy beckett
troy beckett
12,035 Points

thanks for you quick response I added your code to the codepen:

http://codepen.io/tbeckett24/pen/XJZGqp

any advice on what I should do to be able to put my mouse on the sub-menu. Because right now it just disappears when i try to scroll down on to the menu.

Thanks again your response is appreciated