Navmenu questions in pro

Support
#1

site: https://tryvegdev.wpengine.com

  1. I like the green background for my navmenu’s dropdown menus, but not on mobile. how can I change the background color of mobile submenus only?

  2. in my mobile menu how do I change the close button to an X instead of a “”?

  3. in my desktop navmenu, how do I remove the slight dark shadows inside each of the 4 social buttons?

thanks

#2

Hi @COK,

Thanks for posting in.

  1. You mean the vertical white container when the mobile menu is opened? Or is it really the sub menu in mobile menu? if it’s the container then you can simply inspect your menu and go to off-canvas section and change its background color from white to the color you preferred.

  2. Would you mind providing a screenshot? It’s currently showing an “X” icon and it’s been like that. There is no close button that resemble “”

  3. Please add this CSS to your global custom CSS

.hm6.x-anchor, .hm7.x-anchor, .hm8.x-anchor, .hm9.x-anchor {
    border-style: none;
}

Thanks!

#3

  1. I’m referring to the green background of my mobile nav submenu. It’s fine on desktop, but i’d like to change it on mobile-only. Here’s a screenshot: https://s1.postimg.org/662s3ppzdr/mobile-submenu.jpg

  2. This issue seemed to fix itself. It could have possibly been some sort of javascript issue, nevertheless, it’s resolved for now.

  3. This code works perfect - thank you.

#4

Hi There,

1.) Inspect the element > go to Sublinks Tab > Background: Set this accordingly

You are always welcome!

#5

changing these didn’t seem to work, see screenshot:

https://s1.postimg.org/4hmp2wq65b/Screen_Shot_2017-10-23_at_1.20.45_PM.png

#6

Hi There,

I can see it is not working. From inspecting the source code, I found out that you have a custom CSS with !important. That overrides the background that the builder was adding. To understand it better, see this: https://screencast-o-matic.com/watch/cb6TVMI9OV

Please try to remove the following CSS:

.sub-menu a {
background-color: #5c8727 !important;
}


.sub-menu a:hover {
background-color: #f69228 !important;
}

Then control background color and other style aspect using the builder. I didn’t save anything. Try it after removing those custom CSS.

Hope this helps.

#8

thanks, removing this CSS has allowed the Pro header controls to start working properly.

#9

No worries, thank you for keeping us updated :slight_smile:

#10

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.