Divider line above product title collection page

Store Design
, ,

Topic summary

A user seeks help adding a divider line above product titles on their Shopify collection page, providing example images and store credentials (Theme: TASTE, Password: MOHWHI).

Initial Solution Attempt:

  • Made4uo-Ribe provides CSS code targeting .color-background-1.card__inner with border-bottom: 1px solid black
  • Instructions include editing the theme’s CSS file (base.css, style.css, or theme.css) via Shopify admin
  • This solution doesn’t work for the user

Alternative Solutions:

  • Dan-From-Ryviu suggests adding code to theme.liquid after the <head> tag
  • Made4uo-Ribe offers revised CSS targeting .card .card__inner .card__media with border-bottom: 1px solid black !important

Resolution:
The second CSS solution successfully resolves the issue. The user confirms it works and expresses gratitude. Both helpers are thanked for their assistance.

Summarized with AI on November 14. AI used: claude-sonnet-4-5-20250929.
1

Hey, i have an question, does anybody now how to put an divider line above the product title on the collection page? I will show an example below this.

LINK TO WEBSITE: https://e8aaa0-3.myshopify.com/

PASSWORD: MOHWHI

THEME: TASTE

WHAT I WANT: WHAT I HAVE:

unnamed (4).jpg
unnamed (4).jpg2100Ă—1576 854 KB

unnamed (3).jpg
unnamed (3).jpg4032Ă—3024 1.11 MB

1 Like
2

Hi @PRETTYFRIDAYS

Do you mean like this?

Made4uoRibe_0-1700840543885.png
Made4uoRibe_0-1700840543885.png1355Ă—467 201 KB

If it is, check this one.

  • From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  • Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  • In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
.card__inner.color-background-1 {
    border-bottom: 1px solid black;
}

And Save.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

3

Hey thanks for reaching out but it doesnt work, do you have another solution?

1 Like
4

Please open Online store > Themes > Edit code > open theme.liquid file, add this code after tag

Screenshot_8.jpg
Screenshot_8.jpg1009Ă—624 33.3 KB

5

Yes, check this one again. Same instruction. Thanks!

.card .card__inner .card__media {
    border-bottom: 1px solid black !important;
}

And Save.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

6

holy â– â– â– â–  thanks!!!

1 Like
7

Very welcome!