How to remove rounded corners from multicolumn images, Refresh Theme

[shopgrande]

I'm trying to remove the rounded corners from the top of the images and nothing is working, would love some help please.

website url is : macmercuri.com

 

[suyash1 · Accepted solution]

@shopgrande - add this css to the very end of your base.css file and check

.multicolumn-card__image-wrapper {border-radius: 0 !important;}

[WebcontriveApps]

There is already an option in the theme customization to manage the border radius. Please check the screenshot I attached.

[WebcontriveApps]

You can go to the theme settings > Product cards > Corner Radius set to 0.

Please check the below screenshot for reference. 

[Vinsinfo]

@shopgrande Please follow below steps to remove rounded corners from multicolumn images. Let me know whether it is helpful for you.

1. From admin go to "Online Store" -> "Themes".

2. Click "Customize" button from the current theme.

3. Click "Multicolumn" and paste the below code in the "Custom CSS" field and save changes.

.multicolumn-card .multicolumn-card__image-wrapper {
    border-radius: unset !important;
}

Result will be like,

Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.

[ZestardTech]

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:

.multicolumn-card__image-wrapper {
border-radius: 0 !important;
}

[niraj_patel]

Hello @shopgrande 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
.multicolumn-card>.multicolumn-card__image-wrapper--full-width:not(.multicolumn-card-spacing) {
border-top-left-radius: unset !important;
border-top-right-radius: unset !important;
}
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.