Menu with fix header doesen't work on iPad
Permalink Browser Info Environment
Hi
I use the mega menu for a page in a fix header. That works very well on all browser. But on the iPad safari the drop down over the fix header will be cut off.
Is there a way to fix that?
Thanks
I use the mega menu for a page in a fix header. That works very well on all browser. But on the iPad safari the drop down over the fix header will be cut off.
Is there a way to fix that?
Thanks
Type: | Discussion |
---|---|
Status: | New |
Hi JB
The thing is that the header should be fix on one position. When I change that, then navi is working fine but also not fixed on one position.
I tried to add a Z-index but wasn't really success full.
Is there an other way?
Thanks
The thing is that the header should be fix on one position. When I change that, then navi is working fine but also not fixed on one position.
I tried to add a Z-index but wasn't really success full.
Is there an other way?
Thanks
Ah, I see. The problem is that mobile Safari doesn't have built-in support for "fixed" positioning. This isn't a restriction by the Mega Menu add-on. Rather, it's a well known design "flaw" in Safari. It is very annoying for many web developers, but there isn't much that can be done about that unfortunately.
I was afraid of this answer …
Thanks
Thanks
1) Z-index is too low;
2) Position:relative is required on a DIV tag that wraps the menu
Both of these require some reasonable knowledge of CSS. You can confirm the template is causing the issue by setting your page theme to the default "plain yogurt", and if there issue doesn't persist, then it's the theme.
Otherwise, if you have some kind of slideshow block below the menu, that block could be causing the issue (the above 2 suggested fixes should work though).
Hope this helps.
JB