Hello,
I am trying to add borders to my images on categories and product lists, like the photo attached. I have tried a few different suggestions but nothing has worked for me thus far. Can anyone advise me with the correct code to use and where to play it? I am using dawn theme. I
Many thanks in advance
Locate the relevant Liquid file: Identify the Liquid file responsible for rendering the category and product lists. In the Dawn theme, this file is usually named collection-grid-item.liquid or product-card.liquid. You can find these files in the Sections or Snippets folder of your theme.
Add a CSS class or inline style: To add a border to the image, you can either add a CSS class or apply an inline style. Choose one of the following approaches:
class="border-image" to the <img> tag and define the .border-image class in your theme’s CSS file with the desired border style:.border-image {
border: 2px solid #000000; /* Example border style */
}
Hello @rugsrusonline12
You can try this code: it will be helpful to you
Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.
.card--card, .card--standard .card__inner {
border: 1px solid #C0C0C0;
}
@rugsrusonline12 can you provide your store url .so, it can be helpful to figured it out .
Hello, I’ve pasted this code into the bottom of the base.css and unfortunately nothing has changed.
Hi there,
I am trying to do something similar here where I added this code:
img {
border: 1px solid black;
}
into the custom CSS section and that creates a border around the main logo. How can I remove this border around the main logo while still achieving the border around all images? Can this be done?
