Align products pics in collections

[Alliance]

HI Guys, 

I have few pics in collections that are not aligned as shown bellow, how can that be fixed!

Thank you

allianceautoproducts.com

[JHKCreate · Accepted solution]

Hi @Alliance 

The reason behind this stems from the fact that the misaligned image has different dimensions than the rest, hence the breakup.

You have two solutions here:

• Resize the image to match the others (cleanest way)
• Fix a specific image height across all images using code (could lead to more white padding/anomalies to make all images fit under one container)

[PageFly-Victor · Accepted solution]

Hi @Alliance 

This is Victor from PageFly - Landing Page Builder App.

You can try this code by following these steps:
Go to Online store => themes => actions => edit code  and add this code on file theme.scss.css

#ProductCardImageWrapper-collection-template-4513008681100{
height: 250px;
}

Or on file theme.liquid

<style>
#ProductCardImageWrapper-collection-template-4513008681100{
height: 250px;
}

</style>

Hope this answer helps.
Best regards,
Victor | PageFly

[Alliance]

Hi Victor,

I created a section using your app, but I was not able to show the discounted prices as well. How that can be fixed?

Thank you,

allianceautoproducts.com