I've been working on my church website to get things updated and make it easier for volunteers to manage pages as well as menu's in a logical way. The menu system uses Superfish, with a top menu (working fine) and a secondary horizontal menu on some pages.
Getting submenu's to load on this secondary horizontal menu has been complicated. For some strange reason the submenu doesn't show up on my iPhone. When testing in Safari and Chrome it shows up completely fine, on all window sizes.
On the iPhone I can see a slight animation starting, but the submenu never appears. I suspect there's either an issue with the Z-index, or perhaps an overflow issue - either way I've tried many things to get it working with no success.
The secondary menu is in a wrapper with class 'localmenu', and the ul submenu has class 'sub-menu'.
Things I've tried
- Various overflow options
- Z-index
- I read about this '-webkit-transform: translate3d(0px, 0px, 1px)' trick, but it didn't seem to make a difference
Any help would be greatly appreciated - feeling a bit stuck here!
Website: https://www.lifechurchbradford.com (the secondary 2nd menu item 'Get involved' has the issue described)
