Using Dawn theme I am encountering a strange issue with my product images. I am using a masonry layout and while it is working perfectly on PC, only on Apple computers are the first image in each column not aligning (see attached photos: Apple vs PC). I have also attached a copy of the code I am using. The issue appears to me to be caused by a margin-after value. I am very confused because both platforms react to changes I make in my current code so why are they currently different? Any help would be greatly appreciated.
url: https://eggculture.com/
password: v3Ai0zHzuIQU5mC
Issue as appearing on Apple:
correct appearance as seen on PC:
code:
@nevadaskye
Please share the correct store password!
Thanks!
Hello @nevadaskye
We are not able to open your store your store is password protected, please share the correct password so I can review it and provide a solution.
Hello the password is RF7cY9IDz1Cc1Hf
Password is RF7cY9IDz1Cc1Hf thanks!
Hi @nevadaskye
You can try follow this path:
Themes => edit code => asset => base.css
and add this code to bottom of the file base.css
@media (min-width: 750px){
.product-media--masonry .product__media-list{
display: grid;
grid-template-columns: 1fr 1fr;
}
.product-media--masonry .product__media-item {
margin: 0;
}
}
