Minimal theme - full width Custom HTML section

Store Design
1

Hi there,

I have a custom HTML section on my homepage with an image. I’d like to make the image full width on desktop and mobile. Can someone help me figure out what code is needed to do this?

Website: annieryan.net

PW: pot

Screenshot below - I’d like to make the blue image full width.

Screen Shot 2021-11-16 at 9.17.38 PM.png
Screen Shot 2021-11-16 at 9.17.38 PM.png1270×1104 176 KB

Thanks in advance!

Annie

1 Like
2

@anniemittry

yes please confirm this look!

KetanKumar_0-1637211023309.png
KetanKumar_0-1637211023309.png1920×1080 321 KB

3

@KetanKumar Yes, that’s perfect!!

1 Like
4

@anniemittry

thanks for confirm yes please add this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
#shopify-section-163712508506f9f402 {
    position: relative;
    width: 100vw;
    left: -20vw;
}
1 Like
5

Hi @KetanKumar - thank you, that almost worked, but the image doesn’t fully extend and is off center. Any fixes?

Screen Shot 2021-11-20 at 12.14.36 PM.png
Screen Shot 2021-11-20 at 12.14.36 PM.png2382×1192 277 KB

1 Like
6

@anniemittry

its bigger screenshot doesn’t work code it can be done change backcode

7

I’m not sure I understand. Should I change the code? Or is there no fix?

1 Like
8

@anniemittry

yes, its fix to backend code and customization