Mountain based site displays badly in Safari

Im hearing from users that my site which uses the Mountain theme displays badly in Safari.
Titles appear over the navigation menus and text becomes invisible.
Works fine on Chrome.
Is there a known issue/fix?

Do you have a link to the site so we can see what’s going on?

Sure:
www.ursasoftware.com

For some reason, the theme displays the sub menu items on smaller screens, which does make the menu items and banner text clash. I’m not sure if it’s a bug or by design.

You could increase the opacity on the navigation text to improve it, but it won’t solve it. You could also reduce the amount of items in the nav menu.

1 Like

Looks OK in Safari to me. The slogan is maybe a little long but the best bet is for you to look with Safari for yourself.

I can confirm I’m seeing that menu issue too on safari. And opera. And iCab.
And Chrome here also :wink:
If I test my page in Mountain, It does not display the top navigation at all, only as/in the footer?
Don’t know why :wink:
That’s all.
It’s probably my settings are not optimized for Mountain?

But the point of using a template in this way is that it should work across the board… no user should have to change their settings to display my website.
Mountain has been like a Freakshake - looks great - but after you eat it, you start to wonder ‘was that such a good idea’?

Jeff I did not change my settings to view your website, I meant I temporarily changed the theme on my personal website to see how my website reacted/ displayed with the mountain theme . Sorry for the confusion it wasn’t helpful. Viewing your website I can confirm I saw the anomaly he mentioned in various browsers.

In my experience while all stacks are perhaps designed to work in all situations and most do, some may not, or with some themes :wink:
I’m definitely not a power user. I suspect someone here or the developer can find a solution in your case.

You could try to add some custom CSS. This should make the background darker when the mobile menu is open:

#navbarNav.show {
background-color: rgba(0,0,0,.85);
z-index: 2;
}
.show .nav-item {
padding-left: .5rem;
}

You can change the color to any valid CSS color you like.

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.