Hi! I recently added a scalloped border to my header via a css mask property on the header-wrapper in base.css as shown in the code below. This achieved what I wanted visually, but on mobile, the drawer menu is no longer visible. Code: .header-wrapper { --mask: radial-gradient(13.99px at 50…

@McCarthyKP Please replace your code with below code in you base.css file. .section-header .header-wrapper { –mask: radial-gradient(13.99px at 50% calc(100% - 19.20px),#000 99%,#0000 101%) calc(50% - 24px) 0/48px 100%, radial-gradient(13.99px at 50% calc(100% + 7.20px),#0000 99%,#000 101%) 50% …

Thank you! I DM’d you the url & password

Thank you so much! This did the trick :grinning_face_with_smiling_eyes:

@McCarthyKP Our pleasure :slightly_smiling_face:

Hi, I am having a similar issue and adding this code to base.css file doesn’t seem to work. When I add this code the header masks my dropdown menu like this - [Screenshot 2024-07-09 at 16.32.13.png] please help!

Why is the drawer menu not visible on mobile after adding a css mask to my header?

Store Design

shreyhweb April 12, 2023, 7:39pm 2

@McCarthyKP

give us the store URL then we will able to help you.

Topic		Replies	Views
Dropdown menu is covered by header Store Design menu , design , header , customizations , css	1	130	January 27, 2025
Header shape code masking header menu drop-down Store Design menu , design , header , css , shopify-themes	1	35	July 12, 2024
Why isn't my header drawer menu showing on mobile? Store Design design , header , customizations	4	74	October 31, 2023
menu items not showing up in mobile version while its showing on desktop version Shopify Discussion troubleshooting	11	220	July 29, 2024
How To Remove Header In Menu Drawer Store Design menu , design , header , customizations , css , html	8	75	June 24, 2024

Why is the drawer menu not visible on mobile after adding a css mask to my header?

Related topics