Jump to content

Making a Drop Down Menu in a Navigation Bar


lizfaye
 Share

Recommended Posts

So, I'm not experienced with html and I've been trying to create a navigation bar with two drop down menus by following this w3schools guide. The issue I'm having is that I need one of the drop down menus to link to a page when you click on it, if that makes sense. I can't find anywhere on w3schools that explains how to do this.

I managed to get it to work with some duct tape and chewing gum, but because the links are black with white writing and white with black writing on hover I've now broken it so that when you aren't hovering over the first drop down link "Heritage Catering Menu" it's unreadable white on white text when you move your mouse away. If I can just fix this somehow then my html abomination would be perfect. Does anyone know what I need to do?

Here's the link to the code I mangled.

Link to comment
Share on other sites

Be aware, Our Services doesn't have a <a> inside it, so you'll need to correct that for this to work.

 

Replacing 

.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: white;
  
}

With

.navbar a:hover, .dropdown:hover .dropbtn, .dropdown:hover .dropbtn a {
  background-color: white;
  color: black;
}

Does what you want.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...