Menu

Hi,

I recently asked you how to show my entire menu on mobile and you gave me a CSS code to reduce it, however I’d like to reduce it only on mobile and not on computer/tablet.
Can you help?
Thanks!

Hi there

Hope you are having a good day and thank you for your question :slight_smile:
In order to check your question i need to see your live website, please provide url and i will take a look

Hi Noda,
the website is: travelmisadventures.com
and this is the CSS I added:
.dropdown-menu> li> a {
padding: 4px 15px;
}
@media (max-width: 768px){
.navbar-default .navbar-nav> li> a {
padding-top: 5px;
padding-bottom: 5px;
}
}

Hello there,

I hope you are doing well today.

Just to be clear, on mobile you want to have the same menu as the desktop version instead of the icon on mobile?

Best Regards,
Support

Hi!
No, I had to reduce the height of the menu because I could not see everything from mobile. Noda provided me with the code to do that and the problem was resolved.
However, from desktop the menu’s height is reduced too and it doesn’t look nice. Therefore, I want the provided code that I posted to apply only for the mobile version.

Howdy :slight_smile:

Yes i remember this case with the menus, here is the updated code, use it instead of old one:

@media (max-width: 768px){
.navbar-default .navbar-nav> li> a {
padding-top: 5px;
padding-bottom: 5px;
}
.dropdown-menu> li> a {
padding: 4px 15px;
}
}

Perfect as always :wink: thanks Noda!

Hi, there

Awesome! :slight_smile:
Ok, now I will now close the topic and mark it as resolved. Feel free to contact us again Thanks!