Sub Menu not showing on mobile

[molly]

Hi,

When I look at my site on a tablet, only the first of my several submenus shows the arrow telling people that there are more menu options. On my phone the the first and the last submenus appear. I have a lot of menu items but they're all equally important and not being able to navigate to them from the phone/tablet makes my site virtually useless.

In general, I have to say that I am not happy with the Genesis mobile navigations - does anyone have any suggestions for something better?

Thanks

http://101things.com/mendocino/

[Victor Font]

Just tested you site on my iPhone and iPad mobile menus work perfectly. Arrows to indicate sub-menus are present. Colors are little messed up, but it's all working. Can't see what you're complaining about.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[molly]

I don't know what you're seeing but on my phone I have 2 arrows when there should be 7

[mp_alexs]

Hey Molly,

I see what you're talking about. The mobile menu arrow are not visible on most items. It looks like the arrows are positioned differently on each of the items, based on their width.

I went into the inspector and changed this property:

.genesis-nav-menu.responsive-menu > .menu-item-has-children:before

to have position: absolute;, and it appears to have solved the issue on my end.

EDIT: This seems to have solved the appearance issues, but it may have to have the same transitions applied to it as are applied to the menu itself. During the open animation, I'm seeing the arrows completely populated while the menu expands.

[molly]

That worked great. Thanks!

[Author]

Posts