Hi there!
I feel like I’m attempting something that should be fairly straight-forward here, but I can’t crack it for some reason. I’ve built the following page that includes a sticky inline navigation element:
https://shrimpshack.nueramarketing.com/menu/
Visually it works well, but the problem is that the site has another primary sticky navigation (that is required) and the bar that my primary nav elements live within lays over the on-page inline nav. This makes the inline sub navigation unclickable once the primary header appears on page scroll.
I’m attempting to bring just the inline nav element to the very top of the z-index stack (without bringing forward the column, row, or section), but so far I’ve not been able to isolate just that element. It should stay out of the way of the primary nav if it is just the element that is on top.
I’ve attempted to implement the following class elements, but neither seem to be affecting the inline nav element:
#stickymenubar {
position:relative;
z-index:999999999 !important;
}
and
.stickymenubar {
position:relative;
z-index:999999999 !important;
}
Please let me know what you think I should try here. Thanks!
~Grant