Image with Text // content layout // No Overlap on Mobile Only

Shopify Discussion
,

Topic summary

A user is experiencing a layout issue with Shopify’s Origin theme (Version 13.0.1).

The theme includes a feature that overlaps text containers with image containers, which works well on desktop. However, this overlap also occurs on mobile devices, causing the text container to appear unnaturally narrowed.

Desired Solution:

  • Maintain the overlap effect on desktop
  • Remove the overlap on mobile devices only

The user is seeking CSS code that would disable this overlap specifically for mobile use while preserving the desktop appearance. The discussion remains open with no responses yet.

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

Hello Community,

Shopify has this lovely feature, (at least on the Origin Theme) where you can slightly overlap the text container with the image container. This look great on desktop. The problem is that it does the same for mobile use. As as result, the text container is narrowed down, making it look unnaturel.

the question is therefore if we can have a CSS code that forces to NOT overlap when on mobile use, but continue to overlap op desktop.

Thank you in advance. I am using a free theme, called Origin, Version 13.0.1.

Best regards,

2

Thank you in advance. What would be needed to change/add in order to make it work?