Excellent Solution! Worked Exactly as needed. Thank You!
Topic summary
Product images in Dawn render excessively large on product pages; users seek where to adjust sizing in theme files or via CSS (styling code).
Key solutions proposed:
- Edit section-main-product.css: reduce .product__media-wrapper max-width from 64% to ~50%; increase .product__info-wrapper max-width to ~50% and adjust padding (e.g., 5rem). Reported as effective by multiple users.
- Inject CSS in theme.liquid (before or ) to set a fixed width on product media images; one version uses object-fit: cover. Worked for some; OP reported it didn’t, citing image “wonkiness” and quality concerns.
- Resize product thumbnails via base.css by setting a max-width on li items within .product__media-list. Confirmed by others.
Notes and issues:
- Confusion over earlier guidance targeting video, not images; blog on img_url filter referenced but lacked file path details.
- Several follow-ups: request to limit changes to featured products on homepage; desire to sync scrolling of images and description; need to reduce lightbox/gallery image size; padding misalignment after CSS edits (screenshots provided); collection page images (portrait, Dawn 10.0) appear too small/half cut; some unable to increase image size despite CSS.
Status: No single official fix; multiple CSS-based workarounds. Discussion remains open with unresolved collection/lightbox/sync-scroll questions.