Menu not visible on safari
-
Hi there,
I added some parts of my menu structure directly on the page via edit HTML.
Those parts work perfectly on chrome, but are not visible on safari.
The menu items and fixed background bar are not visible.
Could you please help?
Thanks a lot, Paul
———
Here is the URL: https://onzgi.com/artwork/
Here is the code I added on the page via edit HTML:
<!DOCTYPE html> <div class="submenu artwork_menu"> <ul> <li><a href="https://onzgi.com/artwork/" class="_Submenu"><span class="active_submenu_link">All</span></a></li> <!-- <li><a href="https://onzgi.com/installation/" class="_Submenu"><span>Installation</span></a></li> --> <li><a href="https://onzgi.com/sculpture/" class="_Submenu"><span>Sculpture</span></a></li> <li><a href="https://onzgi.com/graphical/" class="_Submenu"><span>Graphical</span></a></li> </ul> <div class="menubar"></div> </div>
Here is the code I added on custom CSS & HTML:
/*MENUBAR*/ .menubar { position:fixed; top:0; left:0; height: 13vw; width: 100%; background-color: white; z-index: -1; overflow:visible !important; } /*SUBMENU GENERAL*/ .submenu { position: fixed; top: 0; right: 0; margin-top: 8vw; z-index: 20; }
Here is the screenshot (chrome vs. safari):
-
i see
why don't you use lay theme's submenu feature?
-
Thanks for your answer, @arminunruh!
It is important to see the submenu items only on specific sites and not all the time:
Therefore, I added those menus directly on the specific site via edit HTML.
Could you find any other solution to solve the origin problem?
I just have no idea why this difference between chrome and safari is coming …Thanks a lot for your support!
-
Could you please help me with some advice, @arminunruh?
-
you need to set the z-index on the .col wrapping div
use the laysers window
you can reorder your element to the top of the layers so it will overlap everything else
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it