Adding separator lines between some items on mobile menu

Solved

Adding separator lines between some items on mobile menu

TBS2023
Shopify Partner
307 1 41

Hello

I am using the Broadcast Theme

www.thebodyshop.ca

datsau

 

I would like to add 2 lines like this on my mobile menu

TBS2023_0-1742296741717.png

 

Accepted Solution (1)
Huptech-Web
Shopify Partner
1169 234 264

This is an accepted solution.

Okay @TBS2023 please follow the same above steps and add this CSS

.sliderule__wrapper:nth-of-type(6) .sliderow__title, .sliderule__wrapper:nth-of-type(8) .sliderow__title {
    border-bottom: 1px solid #000;
}

HuptechWeb_0-1742300363926.png


If you need further assistance, please let me know. If you found my help useful, consider liking this message and marking it as the Accepted Solution.

Best regards
K.K

If you found this response helpful, please do like and accept the solution. Thanks!
Need support with Customizing your Shopify store?
Feel free to contact me at info@huptechweb.com or Visit our website Huptech Web.
Instant Shortcode Builder: Integrate customizable UI features anywhere in your store - No coding knowledge required

View solution in original post

Replies 4 (4)

Huptech-Web
Shopify Partner
1169 234 264

Hello! @TBS2023 Please follow these steps to add this CSS code:

1. Go to your Online Store
2. Click on "Themes"
3. Select "Edit code"
4. Open your CSS file. If you have a custom CSS file, open that instead.
5. If you can't find your custom CSS file, open "theme.css"
6. Add the following code at the end of the file.

@media only screen and (max-width: 767px){
 body .sliderow__title {
    border-bottom: 1px solid #000;
 }
}

 

HuptechWeb_0-1742297239685.png


If you need further assistance, please let me know. If you found my help useful, consider liking this message and marking it as the Accepted Solution.
Best regards
K.K

If you found this response helpful, please do like and accept the solution. Thanks!
Need support with Customizing your Shopify store?
Feel free to contact me at info@huptechweb.com or Visit our website Huptech Web.
Instant Shortcode Builder: Integrate customizable UI features anywhere in your store - No coding knowledge required
TBS2023
Shopify Partner
307 1 41

i do not want it on all the menu items - just in order to highlight 2 items - like the photo i sent

Huptech-Web
Shopify Partner
1169 234 264

This is an accepted solution.

Okay @TBS2023 please follow the same above steps and add this CSS

.sliderule__wrapper:nth-of-type(6) .sliderow__title, .sliderule__wrapper:nth-of-type(8) .sliderow__title {
    border-bottom: 1px solid #000;
}

HuptechWeb_0-1742300363926.png


If you need further assistance, please let me know. If you found my help useful, consider liking this message and marking it as the Accepted Solution.

Best regards
K.K

If you found this response helpful, please do like and accept the solution. Thanks!
Need support with Customizing your Shopify store?
Feel free to contact me at info@huptechweb.com or Visit our website Huptech Web.
Instant Shortcode Builder: Integrate customizable UI features anywhere in your store - No coding knowledge required
TBS2023
Shopify Partner
307 1 41

Hello

Is there a way to stop the two lines form repeating in other areas of the menu.

like here

 

TBS2023_0-1742395694369.png