How to remove the borders on my product tiles in the collection grid

[yeknomgorf]

Hi, I cant work out how to remove the thin red border on the products on my collection page. I’ve checked old posts and have gone through all theme settings and nothing seems to remove them. They dont appear on my individual product pages, just the collection page. Screenshot below, url: picklebits.co.uk pw: chawsss

[Moeed]

Hey @yeknomgorf

Follow these Steps:

1. Go to Online Store
2. Edit Code
3. Find theme.liquid file
4. Add the following code in the bottom of the file above </ body> tag

<style>
.card--card, .card--standard .card__inner {
    border: unset !important;
}
</style>

RESULT:

If I managed to help you then a Like would be truly appreciated.

Best,
Moeed

[yeknomgorf]

@Moeed

.card--card, .card--standard .card__inner {
    border: unset !important;
}

Hey Moeed, thanks for the quick reply. I’ve pasted exactly where you say but it hasn’t changed anything? Is this right:

[Moeed]

You didn’t add the complete code, you just entered the CSS but not the style tags, please add that too!

Best,
Moeed

[yeknomgorf]

Sorry Moeed, I’m at the limit of my Shopify/css knowledge! I have no idea what my style tags are or how to find them. Can you please point me in the right direction?

[Moeed]

These are the style tags, you added only the CSS but not the style tags so add those too.

[yeknomgorf]

@Moeed

<style>
.card--card, .card--standard .card__inner {
    border: unset !important;
}
</style>

Hahaha. Its been a long day infornt of the computer, thought I had to learn a whole new bit of code turns out I couldn’t copy&paste properly

You’re a legend, thanks for your help it worked a treat.

[Moeed]

Thank you for your reply. I’m glad to hear that the solution worked well for you. If you require any more help, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

[tim_tairli]

Again, learn your theme settings rather then editing theme code.
Be very careful because theme code edits will make theme updates difficult and you would not really want it.

First, see if there is a theme setting.
Second, if somebody suggesting to use CSS – try “Theme settings”=> Custom CSS rather then editing theme code.

Ideally – use “Custom CSS” in section settings – this will scope your edits to this particular section as CSS rules may affect other areas.

For this problem there is a setting:

[yeknomgorf]

Hi @tim_tairli thank you for the advice and knowledge, its good to understand how this works.

Note - I did look for a theme setting first, I dont know how I missed this. It makes sense this can be changed within Shopify without going into the code.

Many thanks!