exceptforturnip Posted February 20, 2021 Share Posted February 20, 2021 Site URL: https://www.courtneychecks.com/ Thank you to everyone who has helped already (crawling these questions/solutions has solved so many issues without even having to ask). TL;DR I'm not a proper designer, just trying my best. I'm now having issues with a huge blank space to the right of my whole site. I can fix it by setting the header's overflow to hidden, but that hides my drop-down navigation, which is, naturally, a higher priority to keep. I'm especially running into issues with a strange issue this causes on mobile viewing on certain browsers, as this causes my drop-down navigation to expand into this blank space and show a menu that I hadn't selected. I'm hoping that if I can somehow get rid of this blank space, this will solved the mobile nav issue. Thank you so much in advance. Link to comment
Solution Beyondspace Posted February 21, 2021 Solution Share Posted February 21, 2021 1 hour ago, exceptforturnip said: Site URL: https://www.courtneychecks.com/ Thank you to everyone who has helped already (crawling these questions/solutions has solved so many issues without even having to ask). TL;DR I'm not a proper designer, just trying my best. I'm now having issues with a huge blank space to the right of my whole site. I can fix it by setting the header's overflow to hidden, but that hides my drop-down navigation, which is, naturally, a higher priority to keep. I'm especially running into issues with a strange issue this causes on mobile viewing on certain browsers, as this causes my drop-down navigation to expand into this blank space and show a menu that I hadn't selected. I'm hoping that if I can somehow get rid of this blank space, this will solved the mobile nav issue. Thank you so much in advance. Could you try this .header-menu .header-menu-nav-list { transform: translatey(0); overflow-x: hidden; width: 100vw; height: 100vh; } .header-menu-nav-folder:not(.header-menu-nav-folder--active) { opacity: 0 !important; visibility: hidden !important; } tuanphan 1 BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox) 🗓️ Delivery Date Picker (Squarespace Date format) 💫 Animated Buttons (Referral URL) 🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations) 🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
exceptforturnip Posted March 1, 2021 Author Share Posted March 1, 2021 On 2/20/2021 at 7:21 PM, bangank36 said: Could you try this .header-menu .header-menu-nav-list { transform: translatey(0); overflow-x: hidden; width: 100vw; height: 100vh; } .header-menu-nav-folder:not(.header-menu-nav-folder--active) { opacity: 0 !important; visibility: hidden !important; } This did the trick; thank you so, so much! Beyondspace 1 Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment