Line below menu not showing

Comments

• Phil

  August 8

  Hi,

  Please uncheck this option and see if the line appears then:

  

  Best regards

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• webadmin_vedanta

  August 12

  Hi Phil,

  Thanks for your suggestion. Yes, the line appears after unchecking the arrows option, but the arrows disappear. We would like to have both the line and the arrows. It used to work with the older Betheme version so maybe something can be fixed in the new version to make it work again. Please let me know if there is a quick code patch I can apply at my end while I wait for an updated version with the fix.

  Thank you!
• Phil

  August 12

  Try the following CSS code:

  #Top_bar .menu > .menu-item-has-children > a:not(.menu-toggle)::before {
   content: "";
   height: 4px;
   width: 100%;
   position: absolute;
   left: 0;
   bottom: 0px;
   z-index: 203;
   opacity: 0;
   background-color: #444;
  }
  #Top_bar .menu > .menu-item-has-children:hover > a:not(.menu-toggle)::before{
   opacity: 1!important;
  }
  

  Put it in Betheme -> Theme options -> Custom CSS & JS -> CSS.

  
  

  Best regards

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• webadmin_vedanta

  August 12

  I tried adding the custom CSS you suggested but it didn't work. The line just shows for a brief moment and then disappears, with or without the custom CSS. We have some of our own custom CSS so I tried removing all of our CSS but it still didn't work.
• Phil

  August 13

  I do not see the code I have sent you in your website source.

  If you removed it, please leave it be, so I can check what is wrong.

  Also if you have any sort of cache, please purge it after insertign the code into your theme options.

  
  

  Best regards

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• webadmin_vedanta

  August 13

  Sure, I added it again. Please check now.
• Phil

  August 14

  What do you mean that it does not work?

  It is right there:

  

  Best regards

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• webadmin_vedanta

  August 14

  The line only shows when you hover over a menu item but if you browse to another page within the menu (let's say "Classes" in the screenshot you shared), the line under "Activities" does not continue to show. It used to show persistently in the older theme version giving a clear indication that the user is on a page under that particular menu. It was an experience similar to the mobile menu where the corresponding menu item color changes to white when browsing to a page under that menu. Hope that clarifies.
• Phil

  August 15

  Please replace the second part of the CSS I sent you with the following one:

  #Top_bar .menu > .menu-item-has-children:hover > a:not(.menu-toggle)::before,
  #Top_bar .menu > .current-menu-ancestor > a:not(.menu-toggle)::before{
   opacity: 1 !important;
  }
  

  Best regards

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• webadmin_vedanta

  August 15

  Great, that worked. Thanks so much Phil!