Get Mobile Site to look like Desktop. Also stop repeat page design?

Shopify Discussion

Topic summary

A Shopify store owner is experiencing mobile display issues where the site appears distorted with misaligned elements and cropped images, rather than matching the desktop layout. They want:

  • Mobile site to mirror desktop appearance
  • Different layouts for individual pages instead of repeating designs
  • Previous attempts with various code fixes have been unsuccessful

Another user identified the issue as incorrect CSS being applied to image elements, suggesting:

  • Clear some CSS from the image element
  • Provided a screenshot showing the problematic output on iPhone

The original poster requested step-by-step instructions to implement the fix, noting that buttons and images still appear misaligned on their iPhone. The discussion remains open with the technical solution not yet fully implemented.

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

I’m trying to get my mobile site to look just like my desktop instead of being really weird shaped and cutting off my pictures. I also want each page to have a different layout instead of repeating the same thing on each. Can someone help with this? I’ve tried numerous codes that just don’t fix anything. Here’s my site: https://834f93.myshopify.com/?_ab=0&_fd=0&_sc=1

2

Jakman_0-1693444448840.png
Jakman_0-1693444448840.png546×376 50.1 KB

This is on iPhone. You might applying wrong css that. I clear some css from the image element and get this output.

3

What steps do I need to take to do that? On my iphone the site the buttons and images are still wonking looking. I attached screenshot