Have your say in Community Polls: What was/is your greatest motivation to start your own business?

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

Solved

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

Richey
Tourist
10 0 5

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

Accepted Solution (1)
Dan-From-Ryviu
Shopify Partner
10253 2036 2106

This is an accepted solution.

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 

 

- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

View solution in original post

Replies 7 (7)

Dan-From-Ryviu
Shopify Partner
10253 2036 2106

Hi @Richey 

Drop your store link please

- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

Richey
Tourist
10 0 5

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

password: Thankyou

🙂

Dan-From-Ryviu
Shopify Partner
10253 2036 2106

Hi @Richey

Dod you wan to add diver just in that menu? 

- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

Richey
Tourist
10 0 5

yes just that one, please.

Dan-From-Ryviu
Shopify Partner
10253 2036 2106

This is an accepted solution.

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 

 

- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

Richey
Tourist
10 0 5

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.

weloveminerals
Visitor
2 0 0

Hello,

how would I do it if the title in the dropdown menuScreenshot (167).png 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