How can I align product titles on both desktop and mobile without affecting photo sizes?

Shopify Discussion
1

How do i make the product name titles the same position (on both desktop and mobile)? As you can see in this photo one is higher than the other. I would also like this to not effect the size of the stock photos. Please can someone help? it is really appreciated!

STORE URL: https://c1e46d.myshopify.com/collections/all

position.png
position.png828×613 109 KB

2

Hi @suoshie

This is Kate from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/component-card.css->paste below code at the bottom of the file:

.card__content {
    align-items: end;
}

Hope my answer will help you.

1 Like
3

Hello @suoshie

I would like to give you the recommendation to support you so kindly follow steps below:

  1. Go to your Online store > Themes > Edit code
  2. Open your theme.liquid file
  3. Paste the below code before 
<style>
#ProductGridContainer #product-grid .card__inner{
    height: 280px !important;
    width: auto !important;
}
</style>

I hope the above is useful to you.
Best regards,
GemPages Support Team

1 Like
4

that works thanks! Can you tell me how to do the same for mobile version?

5

On mobile, the product tile will change position depending on the size of the screen. Due to your title line length, it won’t be fixed

1 Like
6

i removed words for all my product titles, and it is still happening even though my titles are very short.

7

I see your problem has been solved. I’d be happy if you want any help

Best regards,

Kate