How to stretch image with text across full screen

Store Design
, ,

Topic summary

A user asks how to make an image-with-text section stretch to full screen width in Shopify’s Studio theme.

Proposed Solution:

  • Access theme code via Online Store → Theme → Edit code
  • Add CSS to base.css file targeting .image-with-text classes
  • Code sets max-width: 100% and padding: 0 with !important flags

Current Status:

  • Another user reports the CSS solution doesn’t work for their homepage image-with-text section
  • They’re seeking alternative methods to achieve full-width edge-to-edge display
  • The discussion remains open with no confirmed working solution yet
Summarized with AI on November 13. AI used: claude-sonnet-4-5-20250929.
1

I’m wondering if it’s possible to have an image with text stretch to the edges across the screen? I’m using the studio theme.

https://fleurelleflowers.myshopify.com/

Screen Shot 2023-01-20 at 7.48.10 PM.png
Screen Shot 2023-01-20 at 7.48.10 PM.png1603×653 180 KB

2

Hello @smander ,

Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->base.css->paste below code at the bottom of the file:

.image-with-text.image-with-text--no-overlap.page-width {
    max-width: 100% !important;
    padding: 0 !important;
}

Thanks

2 Likes
3

Hi,

I have tried this method but it doesn’t work.

Could you help me?

I would like to change the image text on the homepage to full pagewidth so the image touches the edges.

This is my website: https://licaj.com/

Password: backdoor123