Dissapearing drop down menu

[zebyte]

Hi,

Im new with css coding and I am trying to do a dissapearing drop down menu with css.
below is my coding for css & html file. somehow the 2nd list menu is not dissapearing.
I wish to make the 2nd menu not there and when the cursor is hovering on the 1st menu only then it will appear. please help. thank you

https://codepen.io/anon/pen/QBMqGO

[Paulie_D]

I’d start by fixing your HTML…you close the parent li too soon.

This might help a little….keep at it…you’ll get there.

https://codepen.io/Paulie-D/pen/mjMLea

[zebyte]

thank you very much. :)

[zebyte]

another question.

why is the 4 main menu not in the same row? did i miss something. I believe this is probably due to the sub menu coding. but im not sure where to tweak.

[grimslayer]

If you mean the issue where the children ul li elements are not inline and instead are at a diaganol angle change this bit of code from:

#topnav ul li:hover ul li {
display: block;
}

to:

#topnav ul li:hover ul li {
display: inline-block;
}

[Author]

Posts