How to get rid off the white lines in the corner of product card in featured collection?

Store Design
,

Topic summary

A user is experiencing unwanted white lines appearing at the corners of product cards in their featured collection and seeks a solution to remove them.

Proposed Solution:
A PageFly representative provided CSS code to address the issue:

  • Navigate to Online Store → Theme → Edit code
  • Locate the base.css file
  • Add the following CSS at the bottom of the file:
.card.card--card.card--media.background-color-2.gradient {
  border-radius: 100px !important;
}
  • Save the changes

The solution applies a border-radius property to smooth the card corners and potentially eliminate the white line artifacts. The discussion appears resolved with this CSS customization approach.

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

Hi

I wanted to know how to remove the white lines in the edges of product card.

Shop URL: https://60338a.myshopify.com/

Below the photo of what i mean:

how to 10.jpg
how to 10.jpg1465Ă—527 70.5 KB

2

Hi @UL1

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file → Save

.card.card–card.card–media.color-background-2.gradient {

border-radius: 100px !important;

}

Hope that my solution works for you.

Best regards,

Henry | PageFly

1 Like