How can I add a divider line to my dropdown menu?

Store Design
,
1

I’m looking at adding a divider line to my menu but can’t seem to work out how to do it. Any ideas of what code I would need? ideally a feint line and more padding after “3 for £20” but before “Magazines” a bit like I’ve illustrated.

Screenshot 2023-11-08 at 14.02.36.png
Screenshot 2023-11-08 at 14.02.36.png1122×790 95.6 KB

2

Hi @Richey

Drop your store link please

3

https://3c829e-2.myshopify.com/

password: Thankyou

:slightly_smiling_face:

4

Hi @Richey

Dod you wan to add diver just in that menu?

5

yes just that one, please.

6

Please add this code at the bottom of your base.css fi

#HeaderMenu-library-magazines:before {
    content: '';
    background: #000;
    height: 2px;
    width: 80px;
    margin-left: -8px;
    position: absolute;
    top: 0px;
}
#HeaderMenu-library-magazines {
    position: relative;
    margin-top: 12px;
}

le in Online store > Themes > Edit code

7

Very good. With a little tweaking of the height and margins I’ve made it spot on! Thank you so much. Really, really appreciate it.

8

Hello,

how would I do it if the title in the dropdown menu

Screenshot (167).png
Screenshot (167).png1174×805 161 KB

has a space? I’d like to add a divider between “Zeolites” and “Algerian minerals”. I tried it out but I’m not sure how to handle the space in “Algerian minerals”.

Theme Dawn

https://58065e-5d.myshopify.com

Cheers Holger