Can we choose when the menu disappears for mobile?

[Patagonia]

It s great that the menu disappears into a dropdown for smaller screens and mobiles. But it seems to be at a fixed width, independent of the actual menu size, is that correct?

See attached screenshot: the top menu (3 items) is the same as the main menu, which is now condensed. There is no need, as there is plenty of space and a regular menu is much more userfriendly. Can we choose when the menu collapses or can it be made to collapse only when needed due to space restraints?

Cheers!

Attachments:

You must be logged in to view attached files.

[Abe]

Hi, the menus resizes based on the screen size and not on the menu size.
You need to edit a theme file to change the screen size when the mobile menu appears.
Edit wp-content\themes\kleo\assets\css\app.css at line 4057 change 991px to a smaller size if you need:

COPY CODE

/* Test Change breakpoint */

@media (max-width: 991px) {

Remember to make this change after every theme update since it will get overridden by the new theme files.

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

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[Patagonia]

Thank you!

If I add this into the custom CSS field, will it still be overwritten?

Cheers.

[empoweredanimals]

Hi I tried this and it’s not working for us.

Looks like there are a bunch:

@media (min-width: 768px)
@media (min-width: 992px)
@media (min-width: 1200px)
@media screen and (max-width: 480px)
@media (min-width: 480px) and (max-width: 767px)
@media screen and (max-width: 400px)
@media screen and (max-width: 320px) {}

@media screen and (max-width: 767px)
@media (min-width: 768px) and (max-width: 991px)
@media (min-width: 992px) and (max-width: 1199px)
@media (min-width: 1440px)
@media (max-width: 991px) —– THIS IS THE ONE WE CHANGED to a smaller number and it’s not helping

[Author]

Posts