From ae0e39a6388e45bdb35bd577c3a885143de76599 Mon Sep 17 00:00:00 2001 From: Russell Ballestrini Date: Sat, 4 Oct 2025 20:35:37 -0400 Subject: [PATCH] Fix mobile-specific image overflow and remove !important - Remove !important from product-main image rules, use specific selectors instead - Add mobile-specific constraints to .product-images container - Add overflow-x auto for mobile product image containers - Ensure images stay within bounds on mobile without affecting tablet/desktop --- make_post_sell/static/css/common.css | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/make_post_sell/static/css/common.css b/make_post_sell/static/css/common.css index 72ab4fe..d7d84a3 100644 --- a/make_post_sell/static/css/common.css +++ b/make_post_sell/static/css/common.css @@ -268,10 +268,11 @@ img.product-thumbnail { height: auto; } -img.product-main { - max-width: 100% !important; - width: auto !important; - height: auto !important; +.product-images img.product-main, +div.product-images img.product-main { + max-width: 100%; + width: auto; + height: auto; } /* Prevent content sections from overflowing */ @@ -978,6 +979,14 @@ textarea.markup-editor-textarea { /* On mobile, reorder to put purchase section after images */ .product-images { order: 1; + max-width: 100%; + overflow-x: auto; + } + + .product-images img.product-main { + max-width: 100%; + width: auto; + height: auto; } section.product-right {