mobile menu parent item color on click of child

[bengiordano]

Hello!

We have been working through this issue for a few hours now trying just about every CSS selector that we could think of, but are still unable to find a solution — hoping for a little help 🙂

The site can be found here: http://sweetspotlabs.wpengine.com/

When you open it on mobile can open the mobile menu it all looks great. But then when you click on a child of one of the parent menu items, that parent quickly turns white and cannot be seen. We need to adjust this CSS so that parent either turns pink or black so it is sill visible.

Seems like it should be pretty straight forward, but we cannot seem to solve it. Any help would be greatly appreciated!

Thank you!

Ben

[Mohammad – SUPPORT]

HI,
I am not getting this issue at my side so please test with another mobile after and clearing cache.
Thanks 🙂
With Best Regards
Swift Ideas

[bengiordano]

Hey Mohammad,

Yes, we are still seeing the issue. If you go to mobile nav and click on one of the “products” under the “products” heading, then that products heading turns white upon the click.

Thank you!

Ben

[Mohammad – SUPPORT]

HI,
Please attach one marked screenshot so i can check in detail.
Thanks 🙂
With Best Regards
Swift Ideas

[bengiordano]

Hello,

Please find it attached! We need to make that white be black or pink when one of the child items are clicked. Thanks so much for your help, this has been quite the headache!

🙂

Ben

[Kyle – SUPPORT]

Hi

Please can you try adding this to your custom css:

#mobile-menu ul li a {
  color: #000000!important;
}

– Kyle

[bengiordano]

Nope, that doesn’t do it. Its very strange, only happens on mobile and only right when the menu item is clicks (tapped on with finger).

[Kyle – SUPPORT]

Make sure there are no color set to white in the color customiser that could be causing the problem

– Kyle

[bengiordano]

I did try that as well. I think the !important would over-ride that anyways, would it?

[Kyle – SUPPORT]

Please provide me with a login so I can try and solve the issue

– Kyle

[bengiordano]

Hey Kyle,

It’s a live client site, so I would rather not. Cant you troubleshoot just by looking at the CSS?

It should just be one of the selectors, I just cannot seem to find it.

[Kyle – SUPPORT]

I can’t find anything that has the light color, let me forward this to the developer to see if he can help you

– Kyle

[bengiordano]

Yes, me either — been at it for hours :-/

Thank you very much, this would be an amazing fix!

[Swift Ideas – Ed]

Hi there,

This code should sort it:

.mobile-browser #mobile-menu ul li:hover > a, #mobile-menu .menu ul li.current-menu-item a, #mobile-menu .menu ul li a:active, #mobile-menu .menu ul li a:focus {
color: #222!important;
}

Hope that helps!

– Ed

[bengiordano]

yes yes yes! you are my hero ed! thank you so much!!