Second attempt: How to get images to adjust on all screens - Origin theme

Technical Q&A
, ,

Topic summary

A Shopify store owner using the Origin theme is struggling to make images display properly across different screen sizes (desktop, tablet, mobile). This is their second attempt seeking help after receiving no response to an initial April 2023 post.

Solutions Proposed:

  • Video tutorial approach: One responder suggested creating separate sections for desktop and mobile views, acknowledging that landscape vs. portrait orientations complicate universal image scaling. A YouTube tutorial link was provided.

  • CSS code solution: Another user recommended adding custom CSS to the theme.liquid file targeting banner media elements with properties like height: auto !important and display: block. The code aims to make banner images responsive.

Current Status:

The CSS solution did not resolve the issue. The original poster confirmed trying the code (including removing spaces between CSS symbols) without success, sharing a screenshot showing the problem persists. They indicated willingness to try the video tutorial approach next. The discussion remains open with no working solution yet implemented.

Summarized with AI on November 20. AI used: claude-sonnet-4-5-20250929.
6

Thank you! I’m going to give this a try.