How can I adjust the width of my mobile site's image with text section?

Store Design
1

Hello everyone,

I would like some help adjusting the width of my image with text image (on mobile).

I would like my image to be full width so there is no white strip on each side.

The image with text image at the top of my mobile site is full width (man with hat), I would like the earbuds image to underneath to be full width.

I have attached 2 screen shot that show what I am looking for. Thank you.

url: https://y0bb34y19i4nnxy5-54993551588.shopifypreview.com

2

Hi @Timstar ,

  1. Go to Admin > Online store > Themes > Actions > Edit code
  2. Open the theme.css file under the Asset folder
  3. Add the code below.
@media only screen and (max-width: 750px) {
.page-width.feature-row {
 padding: 0;
}

.feature-row__item.feature-row__text {
    padding-left: 22px;
    padding-right: 22px;
}
}
3

@Timstar

can you try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
@media only screen and (max-width: 750px) {
.template-index .page-width.feature-row {
 padding: 0;
}

.template-index .feature-row__item.feature-row__text {
    padding-left: 20px;
    padding-right: 20px;
}
}