hi @DS-Ibro ,
The firstly, can you give the link of store and point the place on the website have issue happen, like that i will easy help you check.
Topic summary
Main issue: Background gradient in Shopify’s Dawn theme renders differently on actual mobile devices versus desktop/mobile preview. On mobile, the gradient shifts vertically or appears inconsistent; desktop and browser dev tools show the expected horizontal look.
Key steps and evidence:
- Multiple users reported the mismatch; one also noted theme duplication changing colors/sizes (not addressed).
- Helpers requested store URLs, passwords (for locked sites), and screenshots/video. Images comparing actual mobile vs dev tools vs desktop were central to diagnosing.
Fix implemented:
- Adding CSS for mobile in base.css resolved it for one store: @media (max-width:767px) .gradient { background-attachment: local !important; } This forces the background to scroll with the element, aligning mobile behavior with desktop.
Status/outcomes:
- Confirmed resolved for one user after applying the CSS. No confirmation from earlier reporters; duplication issue remains unaddressed.
Open questions:
- A user wants the opposite behavior (gradient to scroll/move on mobile as on desktop), noting the fix “holds” the gradient. No solution provided yet.
Notes:
- Dawn is Shopify’s default theme; background-attachment is a CSS property controlling whether a background scrolls with content or stays fixed. Discussion remains open.