Top Menu on Mobile Devices

Hi,
Is there a way to display the Top Menu also on Mobile Devices?
Thx

Hi,

You can display your top bar menu on mobile adding the following code snippet to the Custom CSS section in Theme Settings -> Custom CSS for mobile devices only

.top-bar-right,
.top-bar-left,
.topbar-wrapp .topbar-menu {
    display: block;
}

.topbar-wrapp {
  	height:auto;
}

.topbar-menu {
	float:none;
  	margin:auto;
}

.topbar-menu ul.menu {
	text-align:center;
}

Regards

Thx a lot!

You are welcome!

Hi. I am reopening this topic because after update to the last version of the theme – 5.4.2 – top bar is now showing right on the mobile with the css you gave me.
Please check screenshot on mobile – http://prnt.sc/wjlz2z

Hello,

Please provide your site admin access to the private area.

Best Regards

Ok. I sent you the login details for staging site where we have exactly the same configuration as the live one.

Hello,

I have checked the Theme Settings > Custom CSS > Mobile, I see the code we have provided is added not in full.

In addition, please remove this upper row and check again.

Best Regards

Hello,

I have checked the Theme Settings > Custom CSS > Mobile, I see the code we have provided is added not in full.

In addition, please remove this upper row and check again.

Best Regards

I am sorry. I forgot on staging site it was not in full. Even in full cod you provided first, its not working anymore with the latest version of the theme.
You can check again now. I added the custom css in full.

I did some tests and I found that the following code is solving the problem:

.topbar-wrapp.color-scheme-light {
    height: 50px;
}

It is ok or do you have a better solution?

Hello,

We can hardly suggest something better as I saw the menu with the code and it required more space in height and it is the solution.

Best Regards

[Author]

Posts