[Resolved] Secondary Menu/Safari Conflict

[Riley Moore]

Hi,

I have the secondary menu set to display only on mobile, as I have two different menu structures for full screen and mobile phones. Using .secondary-navigation {display:none;} works beautifully on every browser and device except for Safari. In Safari, hiding the secondary menu results in the widgets from the two columns to float on top of the main content. I can’t for the life of me seem to get this sorted out. Help!

[Riley Moore]

Just realized I didn’t link to my site. Here it is: http://helmholzfineart.com/about

There’s a placeholder over the homepage so you have to navigate to a subpage to view the problem.

And here’s what I’m seeing in Safari: http://s18.postimg.org/eic28ur2h/testing.png

You’ll notice two menu lists floating over the smaller copy.

[Tom]

Hi there,

Try using visibility: hidden and visibility: visible as well as display none/block – let me know if it makes any difference.

[Riley Moore]

Hi Tom,

I didn’t have success with that, but I found a workaround by hiding only the li elements, which prevented the layout from shifting.

Thanks for your help!

[Tom]

Glad you found a solution 🙂

[Author]

Posts