Menu's not displaying correctly on mobile.

[johnand]

We have done some customizing of the header and are having issues with the menu functionality on mobile. Attached are a few pictures of the issue. The “brands” portion of our menu is not part of the top menu, and our menu is expanded when activated, instead of having to drill down. The site can be viewed at: development.holjeron.com

Thanks.

Attachments:

You must be logged in to view attached files.

[Laura]

Hello, can you share admin credentials?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[johnand]

This reply has been set as private.

[Laura]

Hello, this is how i see it

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

Attachments:

You must be logged in to view attached files.

[johnand]

What mobile OS is that? We are seeing the issue on IOS 8.2 with Safari and Chrome.

[Laura]

Hello, please check out attachments,
1. Iphone 6
2. Iphone 4
3. Samsung Galaxy S4

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

Attachments:

You must be logged in to view attached files.

[johnand]

Thanks,

If you look at the desktop version of the site, you can see the issue. “brands” is part of the top bar menu and is not included with the menu pulldown on the top menu on mobile as shown in your screenshots.

The main navigation works correctly both mobile and desktop.

[Andrei]

Hi @johnand, please take a look at it now, I have added a small css to fix the menu on mobile.
Please note, that the top menu location is not fully optimized for mobile, it mainly supports just 1 level menus but I see that it plays nice on your case.

Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[johnand]

Andrei,

We are getting close. Thanks for the help. Now, the “brands” menu item is missing from the top menu mobile navigation pull-down. But, it is no longer showing between the pull-down and the logo.

I also just realized where some of the confusion is coming from. The screenshots Laura posted are from a different site: http://matthewsautomation.com, not the http://development.holjeron.com site that is the topic of this discussion.

Thanks,
John

Attachments:

You must be logged in to view attached files.

[johnand]

Hello,

Actually, I just took a closer look, and as you see in the screenshots, the “brands” menu item is not missing, it is just being displayed below the pull-down and you can see it behind the circle part of the Holjeron logo.

[johnand]

Ok, after clearing my mobile browser cache, it appears to be working, with one minor exception. When I scroll down the page and scroll back up, the top navigation pulldown has all the menu items for the top nav and main nav. I think I can live with that.

Thanks for the help.

[Andrei]

As I’ve said, that menu is not fully optimized for mobile. In your case it works pretty well 😀
We’ll probably improve it over time in updates.
Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[johnand]

Andrei,

Can you post the code that you added here in this post? One of the other Admin’s on our site updated some quick CSS, and your code is missing now.

Thanks,
John

[johnand]

Andrei,

Nevermind, I saved it in my notes. I am adding it to this post for other’s that might want to reference it.

COPY CODE

@media (max-width: 600px) {
.header-normal-header .top-menu > ul { width:50px; }
}

[Author]

Posts