All things Shopify and commerce
I want to make the page width of my product page smaller. It's currently so large, it's right in my face. See example: https://www.viviqsucculents.ca/collections/succulents/products/echeveria-blue-surprise
My theme is Cornerstone.
Solved! Go to the solution
This is an accepted solution.
hi,
<style>
.template-product main#main {
padding: 0 5%;
}
</style>
this css would reduce the width.
This might be happening due to predefined aspect ratio of the image , you can editing the theme.css file
line 9460 - aspect-ratio: 4 / 5 is affecting so mayb consider removing, it seems to work when i try via inspect
note: please a copy and edit the site
This is an accepted solution.
hi,
<style>
.template-product main#main {
padding: 0 5%;
}
</style>
this css would reduce the width.
this worked great, thanks!
glad to help 🙂
Amazing, this works great. Only thing is:
- Width is reduced in mobile mode as well, is there a way to exclude mobile ?
Thank you!
<style>
@media(min-width:768px)
{
.template-product main#main {
padding: 0 5%;
}
}
</style>
Hi you can replace the css with this one it will apply only to desktop .
Thank you so much!
You are welcome !
Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025