Crave theme: Image Banner Cropped In Mobile Version

Store Design

Topic summary

Users report image banner and slideshow cropping issues on mobile devices when using the Crave Shopify theme, while desktop displays correctly.

Primary Solution Provided:

  • Add custom CSS code to theme.liquid file (below <head> tag)
  • Code targets mobile viewport to adjust image aspect ratio and object positioning
  • Initial solution required editing to apply mobile-only styling

Implementation Challenges:

  • Code conflicts occurred when users combined multiple CSS solutions
  • One user successfully resolved cropping but created unwanted blank space beneath slideshow
  • Recommendation: Use only one CSS solution at a time to avoid interference

Additional Related Issues:

  • Button positioning/sizing inconsistencies between desktop and mobile
  • Hamburger menu not opening on mobile (Samsung/Edge browser)
  • Missing product page images
  • Header image cropping
  • Desire to use different images for desktop vs. mobile slider views

The thread remains active with multiple users seeking variations of the mobile image display fix.

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

Hey @olivierttt ,

Use this, instructions are the same