Remove the padding around product card media in Enterprise theme

[Nick_S2]

Hi experts,

How do I remove the padding from the media only on the product card without affecting the text, etc? I still want to maintain the card border radius.

anteck.com.au

TIA. Nick

[suyash1]

@Nick_S2

anteck.com.au

@Nick_S2 please add this css to the very end of your base.css file and check, have very slight padding, you can edit number 5 as per your need.

shopify admin->online store->themes->edit theme code->assets->base.css

product-card.card.card--product {padding: 5px;}

[tim_tairli]

I’d suggest this code in the “Custom CSS”:

product-card {
  overflow: hidden;
} 

product-card .card__media {
  margin: calc(-4 * var(--space-unit));
  z-index: revert-layer;
  margin-bottom:0;
}

[Dan-From-Ryviu]

Please add this code to Custom CSS in theme settings.

.main-products-grid__results .card--product-contained {
    padding: 0 !important;
    overflow: hidden;
}
.main-products-grid__results .card__info-container {
    padding-left: calc(4 * var(--space-unit));
    padding-right: calc(4 * var(--space-unit));
    padding-bottom: calc(4 * var(--space-unit));
}

Best regards,
Dan from Ryviu: Product Reviews App

[Nick_S2]

@tim_tairli perfect. Worked well. Thanks mate