Shopify themes, liquid, logos, and UX
Hi everyone,
I couldn't find where the code is to align our website collection page product grid images, so we have short and tall OR images that in different sizes and they are not lined up properly on our Collection Page.
Is it possible to align them without changing the image sizes?
Thanks in advance everyone! ❤️
Site : www.pavefindings4u.com
All the best!
Please add the following code at the bottom of your assets/style.css file.
.template-collection .product-img img {
width: 100%;
max-height: 200px;
}
Thanks!
Hello There,
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid and paste this at the bottom of the file:
.template-collection .product-img img {
width: 100%;
max-height: 200px;
height: 24vw;
}
Hi,
This code is working however, it is not responsive on mobile view 😞
Code for mobile
@media screen and (max--width: 749px){
.template-collection .product-img img {
width: 100%;
max-height:100%;
}
}
Thank you for the mobile code, however, it seems it is not working? I've pasted it to style.css
Whenever it is applied, the desktop/laptop view is reverting back to not being aligned. 😞
All the best
Please share screenshot what do want
Thanks!
Hi dmwwebartisan ,
Thank you, your code is working, however, it is not mobile responsive 😞
Is there any solution we can make it a mobile responsive?
All the best,
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024