make product images on product page full width

Topic summary

A user wants to remove side spacing from product images on mobile devices for their Shopify store (bear-tees.com), which uses the Palo Alto theme. They express frustration that this customization option isn’t built into the premium theme.

Proposed Solution:
Another user provided CSS code to add to the theme.css file that removes padding from product images.

Current Issue:
The CSS solution worked but affected all images on the product page, not just the main product image. The original poster wants:

  • Full-width treatment only for the main product image
  • Changes applied to mobile view only, keeping desktop layout unchanged

Status: The discussion remains open, with the helper requesting specific examples to refine the solution.

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

i want to make specifically on mobile on the product page - images to be full width. currently there is spacing on both sides and i dont like it. my website is www.bear-tees.com

u pay 360$ for a stupid premium theme and they dont have the option to have images full width. what a disgraceful bleepty theme. i do not recommend buying it. PALO ALTO THEME IS UTTER bleep

Hi Zlati84

  • You can try to follow this step
    Step 1: Go to Edit code
    Step 2: Find file theme.css and add this code at the end of the file
.product-single__details {
    padding: 0 20px !important;
}

.wrapper {
    padding: 0 !important;
}

Result:

Best,

Liz

Liz,

That worked but it also made full width all other images on the product page :disappointed_face: i just want the picture from ur screenshot to have 0 padding. all other images to stay as they are. thanks

also i want it just for the mobile version. For desktop i want it to stay as it is!

Can you share some example?