Yeah, i am facing the same issue from last 1 week
Topic summary
Mobile banner displays cut off on phones when viewing collection/product pages in the Dawn theme. OP tried prior snippets without success.
Attempts and guidance:
- Two replies suggested adding Liquid conditionals in theme.liquid before the head closing tag, but no actual code was provided inside those blocks; this did not change behavior. OP also noted confusion about not finding ; was told to paste near line 34.
- A CSS-based fix was provided (media queries) setting banner image object-fit: none and fixed .banner heights at several mobile breakpoints.
Outcome:
- CSS fix corrected the collection page banner on mobile.
- Side effects appeared elsewhere: other pages’ banners became cropped; the home page banner shrank and spacing looked off.
Context/terms:
- theme.liquid is the main layout file; Liquid is Shopify’s templating language used to target templates (e.g., collection, product).
- CSS media queries apply styles by screen width; object-fit/object-position control how images fill their containers.
Current status:
- Partially resolved with CSS but introduces regressions on non-collection pages. Another user reports the same issue. No final, page-scoped resolution posted; thread remains open.