engineering/make_post_sell
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases 2 Packages Wiki Activity Actions

Fix mobile-specific image overflow and remove !important

Browse source 
- 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
This commit is contained in:
Russell Ballestrini 2025-10-04 20:35:37 -04:00
parent 014f8e7836
commit ae0e39a638
1 changed files with 13 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

17
make_post_sell/static/css/common.css
View file

@ -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 {