Making the Mobile Menu Icon and Background Visible

At a glance

The community member is having trouble making the mobile menu icon and background visible on their website. The comments suggest changing the background color of the menu lines in the tablet breakpoint, removing the padding, and adjusting the size of the menu-icon1. However, the community member is still facing issues with the drop-down menu background not working. Another community member suggests that the background color of the navbar1_menu is transparent on tablet and down, and recommends removing all classes from it (except navbar1_menu) and setting the background color, then re-adding the classes. The community member indicates that this solution worked for them, though they used a slightly different approach.

Useful resources

MMaria Deligiorgi

Hi everyone! Any chance you can see what I’m missing here? I cannot see how I can make the mobile menu icon and background visible.
https://preview.webflow.com/preview/harmon-site?utm_medium=preview_link&utm_source=des[…]e&preview=b5f0030899f8661c4055d79e8302cc1f&workflow=preview

11 comments

JJoey van Zwieten

Change the background color of each of the lines in the tablet breakpoint, they should cascade down to mobile

MMaria Deligiorgi

Thank you! The background then looks weird due to the padding staying transparent. I can manipulate it manually to bring it somewhere but I was hoping that there was an easy fix I’m missing.

JJoey van Zwieten

You can remove the padding?

JJoey van Zwieten

Just make menu-icon1 24px and the padding is gone

MMaria Deligiorgi

It’s still looking like this.

JJoey van Zwieten

You sure you changed the <i>background</i> color of each line? For me it works

JJoey van Zwieten

MMaria Deligiorgi

Ah got you now! I thought that comment was for the actual drop down menu, it worked now!

Any idea why the drop down menu background doesn’t work?

JJoey van Zwieten