Streaming live at 10am (PST)

Navbar Links doesn't works because of a weird class generated by Webflow

Hello there,

I just finished to set up my navbar for touch devices and when I test this out “nav links” doesn’t work. I tried to inspect the code to figured out which was the problem and I find out an auto-generated class by Webflow immediately below to the Nav whit these properties: <div class="w-nav-overlay" data-wf-ignore="" style="height: 812px;/* display: block; */"></div>

Here the overview of webflow and a quick video where I show the issue. If I delete that class everything works fine. Any advice on how I can fix it?


Here is my site Read-Only:

[1]: http://


Hey @niccolomiranda

I think It’s not Webflow. The problem can be solved with z-index. The first problem I see is using -1 z-index.

I don’t like using the Webflow components. Navbar, sections ect… Doing everything from scratch is better in my opinion.

I have a solution in mind, but maybe not the best one.

Never mind :smile: Can you try adding custom css

.w-nav-overlay {
 display: none;

Hoping everything will work fine :crossed_fingers:

1 Like

Hello @PiterDimitrov and thanks for the quick response dude. Unfortunately I tried to delete the z-index and the “bad UX” solution using display: none but the value doesn’t read by Webflow as primary.


Any ideas? that’s crazy!

1 Like

What about

.w-nav-overlay {
 display: none!important;

I have another solution in mind, but I need to record a video. Give me some time :grin:

yesss! it works. thanks a lot @PiterDimitrov

1 Like

Works on my end too :raised_hands:

The other solution is making some changes to the design structure. I can show you if you want. Creating everything from scratch is better.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.