A user encountered styling issues with a dropdown submenu in their Shopify Dawn theme. After adding a “Catering” submenu under “Events,” an unwanted box appeared around the dropdown.
Initial Problem:
Solution Provided:
A community helper provided custom CSS code to be added to the theme.liquid file (above the tag). After the first solution still showed a box around the entire dropdown, refined CSS was provided to style only the “Catering” text without the surrounding box.
Current Status:
The visual issue is resolved, but a new problem emerged: the main “Events” menu item is no longer clickable. Users can only access the dropdown to click “Catering,” but cannot navigate to the Events page itself. The helper indicated this appears to be a theme-level issue unrelated to the CSS fix provided.
Hey all, hoping someone can help me.
Added a sub menu under the “events” page called “catering” but when the dropdown occurs, it looks weird and there is a box around it. See images below.
Only thing I’ve done is added some custom css (code below) for uppercase, spacing and size - not sure if thats the issue or something else?
.list-menu {
text-transform: uppercase;
left: 0px;
top: 30%;
width: 100%;
justify-content: center;
}
.header__menu-item {
font-size: 12px;
}
Hey @dekiv
Could you please provide your Store URL and, if applicable, the Password too? Your cooperation is greatly appreciated!
Best Regards,
Moeed
Hey @dekiv
Follow these Steps:
Go to Online Store
Edit Code
Find theme.liquid file
Add the following code in the bottom of the file above tag
RESULT:
If I managed to help you then, don’t forget to Like it and Mark it as Solution!
Best Regards,
Moeed
@Moeed thanks for your help.
Is there any way to not have that box around the “catering” when it drops down? Only to have it as the word.
Hey @dekiv
Remove the previous code ( If added ) and add this code
Follow these Steps:
Go to Online Store
Edit Code
Find theme.liquid file
Add the following code in the bottom of the file above tag
RESULT:
If I managed to help you then, don’t forget to Like it and Mark it as Solution!
Best Regards,
Moeed
@Moeed Thank you! That worked
I might be missing something but its not possible to click on the “events” menu item anymore to take you to the events page? Once clicked, it only allows you to click on the dropdown for “catering”. Have I done something wrong here?
Hey @dekiv
This seems to be your theme issue because the code I provided has nothing to do with links.
If I managed to help you then, don’t forget to Like it and Mark it as Solution!
Best Regards,
Moeed
