Help Aligning Product information text On Collection Pages (Prestige theme)

[Boogie_dk]

I am using Prestige theme. On the collection pages, there is a misalignment on the product info because some product names are longer than others. Is it possible to code it some how, so the price for the smaller titles make a line break or something else so the prices will always be aligned in the grid? I have attached a screendump and you can also visit the online store: https://petersolberg.com/collections/new-arrivals

[Made4uo-Ribe]

Hi @Boogie_dk

Just a suggestion. I make it like this.

This is the code I used.

From your Shopify admin dashboard, click on “Online Store” and then “Themes”.

Find the theme that you want to edit and click on “Actions” and then “Edit code”.

In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

.v-stack.justify-items-center.gap-2 {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 7rem;
}

And Save.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

[Boogie_dk]

Is it possible to only do it with the price and not the product name?

[Boogie_dk]

Thank you. Is it possible to do it in a way, så the full product name always will be displayed?

[Made4uo-Ribe]

Yep, Like this?

Same Instruction.

.v-stack.justify-items-center.gap-1 {
     display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 5rem;
}

And Save.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!