Webflow Navbar Not Fitting? Easy Fix Without Adding Breakpoints

Get the cloneable for this project (affiliate link)
try.webflow.co...
Join my Webflow Wizards Community
/ timothyricks

[@ivanbadia3232]

I've been controlling my desktop nav wrong all this time. Thank you, T. Ricks, for this solution.

[@timothyricks]

So glad this helps! 🙂

[@pelangos]

Thank you Tim! This sounds like the proper way to create a webflow navbar. It also helps with ADA / accessibility issues. I've been reading all about shopify store owners getting sued because their theme templates aren't developed correctly. Anyways great tips again.

[@HamzaMajeed-h8k]

After watching your video, I always realize that I know nothing about Webflow.😅

[@Entersge]

I dunno how it works but literally when I get stuck with something here you are with the solution! Wild! Thank you so much!

[@timothyricks]

I'm so glad this helps! Someone in my community had this issue recently so videos like this usually come from questions that other people are asking.

[@timdaff]

Awesome solution! Thanks Tim

[@JackGSF]

Funny, cus I was working on this issue today for the first time. Thanks for the solution!

[@gitaadi]

THIS IS GOLD! Thanks Tim!

[@marcoinnocenzi1494]

Can this solution cause SEO issues? Thank you Tim

[@timothyricks]

Hi, this shouldn’t negatively impact SEO since the links are the same in both instances. Here’s a detailed explanation. chatgpt.com/share/66e43c42-0d40-8011-a462-1c97d6fa4abc

[@tjk_9000]

this is so clutch

[@mislavrepinac]

Very helpful! I'm just wondering if it's a problem to have two navbars in the document?

[@timothyricks]

Thank you! It’s common practice to have multiple nav tags on the same page. Anything that holds navigation links should be wrapped in a nav tag including links inside a footer.

[@the-secrettutorials]

You legend!

[@fuster7474]

But is it recommended to use Webflow's native navbar component? I've been building it myself with divs without using it and I always thought it was the best way to work with it.

[@timothyricks]

The same process works with custom navbars also. Webflow native navs and custom navs both work well, but a custom one usually offers more control.

[@luqmanhabibulhaq2964]

but how to do that for phone ressolution?

[@timothyricks]

It automatically switches to the mobile view by the time we get to a phone resolution because of their small screen size.

[@luqmanhabibulhaq2964]

@@timothyricks so i have a collection list 8 item in two row, then i watched on phone its just make a bigger view scroll down, is that normal? or what i should do for make that seems like in pc desktop?

[@timothyricks]

@@luqmanhabibulhaq2964 The menu might need a max height using VH and overflow auto so that it doesn't get too large and so we can scroll inside it. If you have a 2 column layout, you could manually reduce it to 1 column on a smaller breakpoint, but using an autofit grid would be better so that the column count automatically reduces based on the space available, not just screen size.

[@EthanSuero]

YOU'RE THE MAN!

[@nacakcii]

You are the best

[@timothyricks]

Thank you! So glad this helps!