How to remove border from image, imag with text dawn theme

Store Design

Topic summary

A user seeks to remove a gray border from images in the Dawn theme’s “image with text” section and adjust image/text width proportions.

Solutions offered:

  • CSS overrides: Multiple users suggest adding border: 0px or border: none !important to files like component-image-with-text.css or theme.css.

  • Theme settings (recommended): One user points out that Dawn has built-in settings under Customize Theme > Theme Settings > Media > Border, where thickness can be changed to 0—avoiding unnecessary CSS code.

Community response:

Several participants confirm the theme settings approach works best, noting that CSS overrides can slow down the store, complicate theme updates, and create maintenance issues. One user reports still experiencing a small border even after adjusting settings, indicating edge cases may exist.

Status: The original poster marked a solution as accepted, though the discussion continues with users validating the native theme settings method as superior to custom CSS.

Summarized with AI on November 7. AI used: claude-sonnet-4-5-20250929.
1

Hi,

How do I remove the gray border from the picture in image with text, dawn theme?

And secondly, how do I make the photo smaller so I can have the text wider.

picture: https://ibb.co/yq8kzNn

https://lepetitmacaronshoppe.myshopify.com

pass heugli

Thanks

1 Like
2

Go to Assetes/component-image-with-text.css And add boarder 0px as below.

.image-with-text__media{
boarder: 0px;
}
1 Like
3

Hello There,

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset >theme.css and paste this at the bottom of the file:
.image-with-text .global-media-settings {
border: 0;
}
1 Like
4

@urbantis ,

Please add this CSS to your css file

.image-with-text__media{
    border: none !important;
}
.image-with-text__content {
    padding: 6rem 1rem 7rem !important;
}

Thanks!

4 Likes
5

Thank you

6

Thanks

7

I know this is old with an accepted solution already, but CSS overrides arent the fix for everything. Dawn theme has Theme Settings where this can be turned off. go to Customize Theme, Theme Settings, Media, Border …change Thickness to 0

10 Likes
8

JoeCat, thank you so much! I swear I tried all the other solutions and yet changing this setting is the only one that worked! You are the best, thank you for posting!

2 Likes
9

Awesome, thanks for the comment. Glad it helped you out. Best of luck with your shop.

10

@JoeCat This is what actually fixed it for me - thank you!

11

@JoeCat exactly. So many in here have 0 clue of what the essence of coding is.

They suggest unnecessary filler CSS without realising:

a) it makes your store slower

b) it messes with your theme

c) updating your theme code will be a nightmare

d) name the worst thing here

12

Hi JoeCat, even after changing thickness to 0 I still have a small border. Tried every code I could find here and still struggle. Do you have any idea how to fix that?

Website : www.exceller.ch

13

You’re the saviour! :heart_eyes:

1 Like
14

Living Legend… thank you!