Shopify themes, liquid, logos, and UX
Hey,
Is there a way to reduce the product price size on collection pages for mobile view only? I found a way to adjust the size for desktop but now it’s way too big on mobile view. I couldn’t find a code to only adjust it on mobile. I will add a picture about the issue below.
My store url: bellevodesign.com
The issue:
Solved! Go to the solution
This is an accepted solution.
You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code above the </head> tag
<style>
@media screen and (max-width: 768px) {
.price, .price--on-sale .price-item--regular{
font-size: 1rem !important;
}
}
</style>
Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!
This is an accepted solution.
You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code above the </head> tag
<style>
@media screen and (max-width: 768px) {
.price, .price--on-sale .price-item--regular{
font-size: 1rem !important;
}
}
</style>
Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!
Worked perfectly, thank you!
Do you happen to know how to reduce the padding between the cross over price and the sale price?
Which part? Can you provide a detailed explanation?
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025