What happened to my dropdown menu arrow?

Shopify Discussion
1

Capture d’écran, le 2025-04-22 à 10.57.25.png
Capture d’écran, le 2025-04-22 à 10.57.25.png1358×120 6.12 KB

Hi there! I’m not sure what happened to my arrows—would it be possible to fix this? I really appreciate your help, thank you!

2

Thank you for your reply, i tried copy/paste the code at the bottom of base.css but noting changed, is there something else i can check?

3

Hi @Boutique_citrou

Welcome to the community. It looks like there are not enough space around menu items, so the caret goes over text as it is positioned absolutely.

You just need to add bit more padding: find this code

and change it to

So just one line padding: 1.2rem 2rem;

But where is this code I am not sure, it could be in theme.liquid which is not a good place but hey.

The alternative is to put the following code at the end of base.css

@media (min-width: 768px) {
    .list-menu .list-menu__item {
        padding: 1.2rem 2rem !important;
    }
}

Using !important is not a good practice but it should work if you can not find first code.

4

Thank you so much! I find the code in theme.liquid and then switch the padding at 1,2 and 2 rem and it worked wonderfully!