Navbar and hamburger buttons both visible at Tablet and below

I’m rebuilding the default Webflow Navbar element using Client-first class naming conventions. The problem I’m having is that the when I change from the Desktop breakpoint to the Tablet breakpoint, the Contact button in my navbar continues to appear in the navbar while its sibling link elements disappear as you would expect. The net effect is that both the Contact button and the “hamburger menu” button elements are both visible at the Tablet breakpoint and below. The Contact button should only be visible at the smaller breakpoints when I click the hamburger icon. I’ve compared my elements from top to bottom in the Navigator window with another project in which the navbar works as expected and I can’t see any differences. I don’t understand why this is happening. Can anyone see the problem? Thanks!


Here is my site Read-Only: https://preview.webflow.com/preview/client-first-examples-0ad265d8c0c31?utm_medium=preview_link&utm_source=designer&utm_content=client-first-examples-0ad265d8c0c31&preview=69651a6ba4e931701d642781a6cfcb87&pageId=6244cf9eb46c32363c453462&workflow=preview

Hi Robert!
Your Contact button is outside of the wrapper that contains all of your nav links for the mobile menu, so there’s nothing to actually tell it to only display when you click the hamburger button. To clarify, do you want this button to appear here as shown, or do you want it to remain in the same position, but only appear when the hamburger button is clicked?
image

Hey Chris! How’s it going?

To answer your question, I want it to appear as you show it above. But to do that, I thought it was only necessary to put the Contact button inside the nav_menu-wrapper div, not the child nav_link-wrapper div that contains the nav links for the mobile menu. As you can see, that’s what I did with the other website I’m working on (you gave me some help with it in another question a few days ago) and the Let’s Talk button in that project is hidden at the Tablet breakpoint as it should be.

Going great, thank you! Appreciate the clarification. Would you mind posting a read-only to the other project you’re referencing? I’d like to give it a second set of eyes just to compare the two menus and see if I can spot anything.

Certainly! Here’s the link.

1 Like

Man, honestly, I’m at a loss. I’ve gone over the settings on both navbars a few times now and either I’m missing something obvious or this just isn’t working “for no reason”, so to speak. If you delete the nav component entirely, and copy/paste from your other project, does that work as expected, and can you just modify it for the new project/

1 Like

So they appear identical to you as well! I’m glad it wasn’t just me because I’ve compared the two navbars element by element twice yesterday and once today and I haven’t been able to find any difference. Perhaps Webflow “hiccuped” when it saved the elements at some point and something we can’t see is out of whack.

So yea, I’ll have to delete it and start over. Um, is it possible to copy and paste elements between projects? I’d like to do that but the clipboard has always been empty when I’ve tried. I can copy/paste elements between pages in a project but not between entirely different projects. Is there some trick to this?

Thanks again! I really appreciate having a fresh set of eyes look at this. Have a great evening.

You should be able to copy-paste between projects, but to be honest it’s never worked for me either. A buddy of mine just shared this with me earlier today, maybe it could make this a bit easier for you. Copyflow

1 Like

Cool! I’ll take a look at Copyflow tomorrow.

By the way, I really do appreciate your help. I’m going to DM you on Twitter tomorrow to see if there’s any way I can return the favor.

1 Like

Happy to help! Talk soon.

Hey Robert & Chris!

I like a good puzzle and this seemed perfect to lose sleep over LOL
( I’m still up at 6.40 am :sweat_smile:)

I think it might be a specificity issue (easy, to check with the fs extension but you can’t in a read-only).
I found this main difference while comparing and that’s why I thought it (I could be wrong though… mine is cleaner :smiley: )

Anyway, I rebuilt it, a step at a time, and seems to work (I didn’t bother with mobile but it should work) :slight_smile:

Rebuild link

Any thoughts? Should I have gone to bed? :sweat_smile: :joy:

My cart slide popup is not working on the about page but It’s working on every browser and every device and every page except for the about us page on IOS, I’m confused about what is causing it I tried giving that section a z-index but it’s still the same. please help me with this issue.
https://gemini-skin.webflow.io/about-us

Thank you Maria! I’m so sorry for the super-late reply but once I solved the problem, I didn’t return to the forum to see if anyone else had also replied. My apologies.

P.S. It was nice to see you at yesterday’s first Finsweet Pro meeting!

1 Like

haha no problem!

So what was the issue?

PS you too, PRO buddy! :smiley:

Hey Maria! I don’t know what the issue was. Chris and I both examined everything in my page line by line and we couldn’t see any difference at all. I ended up rebuilding the section in question and the problem went away. I sometimes wonder if Webflow “burps” every once in a while when you’re saving a file and introduces a problem. I think that in situations like this, you almost have to examine the CSS at the place where you’re having a problem, figure out what the correct CSS should be, try to find the element and its styles that generates that CSS, and see if you can see the problem. So much for no-code! haha

1 Like

Latest burp i got was cloning a project and the code wasn’t working. I opened in Webflow from the cloneable and the code was different. Copied that to the cloned one, et voila!

Wonders of noCode :grin:

1 Like

Can you “copy” code between projects? I thought that wasn’t possible. :thinking:

1 Like

oh yeah!

As long as the code is not in the project’s custom code, you can simply copy it since it’s just text. Copying an embed, of course, won’t work.

I know things! :tophat::magic_wand::crystal_ball::joy::joy:

1 Like

I think we may be thinking of different things. If I’ve built a section in one project, what I’d like to be able to do is copy that section to another project. However, that doesn’t seem possible unless you just create a copy of the entire project and build a second project from it. I suspect that what you’re talking about is copying some CSS or JavaScript code that you’ve put inside the tag or before the tag from one project to another. That I understand and, of course, you can always do that. Thanks!

Designer to designer (as long as it is your project) you can copy pretty much anything. You’ll get the classic "to avoid conflicts we renamed the classes etc.

Unless this is not what you mean (i might have covid and my brain is a bit wonky :sweat_smile:)

1 Like