Hey @babystore123 ,
Are you sure you are doing this on the right theme?
I am not seeing the code anywhere in the website at all.
Topic summary
Goal: Show the current (new) price before the compare-at (was) price across product and collection pages in Shopify’s Dawn theme.
Key steps and fixes:
- Initial CSS suggestion targeting .price-list.price-list–centered didn’t change anything, partly due to edits being made on the live theme instead of the preview theme. A preview link was later shared to ensure changes apply to the correct theme.
- Working approach: add CSS (in Theme settings > Custom CSS or theme.liquid) targeting the sale price container:
- Desktop: .price.price–on-sale .price__sale { display: flex; flex-direction: row-reverse; gap: 10px; }
- Mobile behavior: Side-by-side on small screens was discouraged due to limited space. A media query was provided to stack prices vertically and keep them centered:
- @media (max-width: 768px) { .price.price–on-sale .price__sale { flex-direction: column-reverse; gap: 0; justify-content: center; } }
Outstanding issues:
- On collection pages, the sale price block alignment remained right-aligned instead of centered; no definitive fix was posted.
- Other members asked for the final solution; outcome not publicly confirmed.
Status: Partially resolved (order switch works); alignment/side-by-side on mobile remains open.