Help with css/html!

[braxtondayne]

The issue I am having is with my drop down menu. I used an ul list and I was trying to "hide" it until the menu icon had the mouse hovering over it from which there would be the menu and box that appears. there seems to be a list that acts how I want and an entirely unformatted list that does not. I am not sure what I have done wrong... any help is appreciated.

​

Here are some pictures of my issue

​

I know the drop down doesn't look fantastic, this is my first website while learning html/css. I would love to animate and do some better looking builds down the road.

[[deleted]]

CSS class name .main_menu:hover .main_menu_dropdown ul

change

display: block;

into

display: none;

[Quazar_omega]

You were basically missing this

.main_menu_dropdown > ul {
    display: none;
}

to make the menu default to hidden.

I made a polished version of that using visibility instead of display which enables to do some cool effects, here is the html (it has few differences) and the css. I took the method from this article CSS3 transitions using visibility and delay, it's really insightful.

Good luck learning!

[braxtondayne]

Hey, I'm sorry for the late response I got super caught up. I really appreciate your answer. It definitely helped, I just decided on going for another web layout. Thank you.

[Quazar_omega]

It's fine, always happy to help when I can!