Image border

Shopify Discussion
1

I’m using shrine theme pro and on the template section I’m using “image with text” and I’m trying to make the image border straight and not rounded

2

Could you please share your store URL and password [if applicable] so that I can take a look and provide you solution code.

Looking forward to hearing back from you.

Thanks

3

@jasmine19 ,

To remove the rounded corners from the “Image with Text” section in the Shrine Theme Pro, you’ll need to override the default border-radius via custom CSS. Add the following code:

.image-with-text__media img {
  border-radius: 0 !important;
}

Steps to apply:

  1. Go to Online Store > Themes > Customize.

  2. Click on Theme Settings or locate Custom CSS (usually under theme settings).

  3. Paste the code above and save.

This will make the image corners straight instead of rounded for that section.

If you’re still seeing rounded corners, the theme may use a different class—share your store URL and collaborator request code, and I’ll fix it for you at no cost.

4

hello @jasmine19

Go to online store ----> themes ----> actions ----> edit code ----> assets —> base.css
add this code at the end of the file and save.

.image-with-text__media img {
  border-radius: 0 !important;
}

If this was helpful, hit the like button and accept the solution.
Thanks

5

Hi @jasmine19

You can use below template as a reference here:

img {
  border: 5px solid #555;
}

Here are the explanation of values after border:

5px means the thickness of border.

solid means a continuous, straight line.

#555 is the color of border.

You can adjust the values of them according to your website element specifically to realize what you want directly. Thank you!