Navigation Menu - Page Link Text in Dropdown is Invisible in Mobile Views (Preview/Published Site Only)

Hey all!

I’ve recently started using Webflow and am encountering an issue for which I can’t find a cause or fix. In every screen size smaller than standard desktop, my site uses a hamburger menu for the navigation. In the Designer, everything in the open menu looks good; however, when I publish or look at the site in preview mode, every tab in the open dropdown menu (other than Home) is hidden from view—I can click on the area the other page links (Services, Gallery, About, and Contact) SHOULD be and will be taken to the correct page, but the text isn’t visible.

Any ideas why this may be happening?

Thanks in advance!


Here is my site Read-Only: https://preview.webflow.com/preview/captivating-cleanliness-llc?utm_medium=preview_link&utm_source=designer&utm_content=captivating-cleanliness-llc&preview=81feebdf702ff50ec3cfbd513e5a966b&mode=preview

Hi Tyler,

I really like your website design!

Been digging into your problem but I couldn’t find a way to fix it. When inspecting your dropdown-navigation, it looks like there is a value “opacity:0” set on the nav-links, causing them to be invisible:

Changing it to 100 manually (through my browser inspector) makes the links visible.

Unfortunately, I didn’t find a way to address the class “nav-link w-nav-link w–nav-link-open” in the webflow designer. I have no idea how to change styles for Open-State.