Align add to cart buttons on featured collection

Align add to cart buttons on featured collection

Mattinnovations
Excursionist
47 0 13

Hello!

 

This is my website: https://drizzilicious.myshopify.com/

password: drizzy

Theme: Dawn

 

On the featured collection slideshows on the homepage the add to cart buttons are not aligned (on all devices) does anyone know how I can correct this please??

 

I attached a screenshot for visibility - some buttons are higher than others, especially on mobile but it's noticeable on desktop also..

 

add to cart unaligned.png

 

Any thoughts? Thanks so much!!

 

Matthew Ortalano

Reply 1 (1)

joeybab3
Shopify Partner
126 16 31

I can see a few things going on, for some of them, your images are not the same height leading to minor few pixel differences in heights or for images with entirely different aspect ratios, rather large differences. 

 

For others, you have more text in the title leading to it being two lines which causes the add to cart button to be lower.

 

The fix for both is to set fixed heights/aspect ratios for the image section and set height:auto or re-code the section to use grid properly in a way that will fill it out as needed and not have different heights.

 

You could also just use the same aspect ratio for all images and make sure your titles have similar lengths/force two lines of height.