How can I add divider lines to my cart page?

janulcandles
Visitor
3 0 1

HELLO!  I can't figure out how to had divider/separation lines onto my cart page. I want to separate the products with a lineScreenshot 2024-04-22 at 6.01.15 PM.png

Replies 4 (4)

Sonya_2025
Shopify Partner
168 23 34

Hey @janulcandles 

Can you share your store URL if you do not mind?

Please let me know if it works by giving it a Like or marking it as a solution!
Feel free to reach out. EMAIL ME  
Motivate me by  PAY ME
janulcandles
Visitor
3 0 1

janul.shop

 

Sonya_2025
Shopify Partner
168 23 34

Hey @janulcandles 

Pls follow below steps:

1. Open the theme code editor

2. Find the file "component-cart-items.css" in the asset folder.

3. Find the CSS class like below. 

Sonya_2025_1-1713842662421.png

 

add a "border-bottom" style in it like below.

 

 

 

.cart-items td {
  vertical-align: top;
  padding-top: 4rem;
  border-bottom: .1rem solid rgba(var(--color-foreground), .08);
}

 

 

 

 

Hope this helps.

Please let me know if it works by giving it a Like or marking it as a solution!
Feel free to reach out. EMAIL ME  
Motivate me by  PAY ME

EFOLI-Emilia7
Shopify Partner
320 10 38

Hello @janulcandles,

Need to add code into base.css file

 

Navigate to the online store >> Click edit theme code.

@media screen and (min-width: 750px) {
    .cart-items td {
        border-bottom: 1px solid;
    }
}

 

 

Emilia7 | eFoli
-Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- Checkout our apps:Inkybay || MultiVariants