Liquid, JavaScript, themes, sales channels
Hi, all. Can someone help to inspect my page's featured product section?
The image doesn't fit the frame,
As you can see, there is a white area under the featured product's image, and it's supposed to be the image stretched to fill the white spaces.
If any experts know how to solve this, please let me know if there's a solution for this. Appreciate much!
Here is the details of the website.
https://www.palettepaws.com/
password: cheath
Solved! Go to the solution
This is an accepted solution.
Please update code and check again
<style>
.featured-product .grid__item.product__media-wrapper {
position: relative;
}
@media screen and (min-width: 750px) {
.product-media-container.media-fit-cover, .product-media-container.media-fit-cover .product__modal-opener, .product-media-container.media-fit-cover .media {
position: absolute;
width: 100%;
}
}
</style>
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
Please add this code to your Online store > Themes > Edit code > open theme.liquid, add this code below before </head> tag
<style>
.featured-product .grid__item.product__media-wrapper {
position: relative;
}
.featured-product .product-media-container.media-fit-cover .media {
position: absolute;
width: 100%;
}
</style>
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
Hi, @Dan-From-Ryviu
Thank you so much for trying to help!
I've tried the code above, but nothing seem to change after applying the code.
Do you know what could be the issues?
This is an accepted solution.
Please update code and check again
<style>
.featured-product .grid__item.product__media-wrapper {
position: relative;
}
@media screen and (min-width: 750px) {
.product-media-container.media-fit-cover, .product-media-container.media-fit-cover .product__modal-opener, .product-media-container.media-fit-cover .media {
position: absolute;
width: 100%;
}
}
</style>
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
It works perfectly. Thank you so much for helping out!
Glad I could help.
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
User | RANK |
---|---|
37 | |
28 | |
14 | |
13 | |
9 |
Make the shift from discounts to donations, and witness your business not only thrive fina...
By Holly Dec 4, 2023On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...
By Skye Nov 8, 2023