Jump to content

ColoradoTinting

Member
  • Posts

    1
  • Joined

  • Last visited

ColoradoTinting's Achievements

  1. Hello everyone, After searching through the forums for a solution I wasn't able to find any solutions to my problem. What I am looking for would be either to make the nav go into the hamburger as soon as the last item in my nav starts to get cut off or just to have the Hamburger menu visible the entire time. I have been trying to find solutions for either option but no css i have found online is working for me. I do not want the nav to stack either when the window size is reduced and i have also attached a picture of when the nav gets cut off. Website: https://coloradotinting.com/ as of right now the only code in there is for the nav not to wrap which is: nav.site-navigation { white-space: nowrap; } The codes that I have tried are below: @media screen and (min-width:768px) { /* hide navigation */ .header-nav { display: none; } /* Hide header button */ .header-actions { display: none; } /* show burger */ .header-burger { display: flex; } /* Show overlay mobile menu */ .header--menu-open .header-menu { opacity: 1; visibility: visible; } } @media screen and (max-width: 5000px) { /* Display burger icon at all widths */ .header .header-burger { display: flex; order: 0 !important; } /* Make burger menu visible at all widths */ .header--menu-open .header-menu { opacity: 1; visibility: visible; } /* Center logo in mobile device */ .header-title { text-align: center !important; } /* Hide primary navigation menu */ .header .header-title-nav-wrapper .header-nav { display: none; } } Thank you for the help.
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.