Question 165802 in Wordpress Question posted in
The official Wordpress documentation can be found here.

Why won’t sub-menu’s on WordPress site display on hover?

I am working on a site that that is supposed to display sub-menus when you hover over both the "References" and the "Contact Us" items in the main nav. However, these items will not display.

I have tried adding hover properties via CSS to the menu & sub-menu items but nothing seems to work. It seems to always default to the "display: none;" for the sub-menu.

Here is the URL for the site: http://fongconstruction.com

I’m not sure where to go from here, if there is a CSS fix that maybe I’m missing then any guidance would be helpful! Thanks in advance!

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I was able to locate a solution by using a different selector that I had not thought of before:

    #menu-item-5990 a:hover + .sub-menu,
#menu-item-5237 a:hover + .sub-menu {
display: block;
}

  2. 0

    First you need to delete below css from custom.cs(line number 1) and style.css(line number 844) https://prnt.sc/15pru62

    #nav .sub-menu {
    display: block !important;
}

    Also you need to delete inline style(display: none) from sub menu https://prnt.sc/15ps03v

    After that add this css

    #nav li ul.sub-menu {
    display: none;
}

#nav li:hover ul.sub-menu {
    display: block;
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search