How can I align product prices in the Dawn theme?

Store Design
1

Hi,

I would like to align the prices in collections grid. Some of my product titles are longer than other, and it makes my prices not aligned. Any thoughts how to achieve this?

website: adambiernatstudio.com

password: drowre

It looks like this:

Price-alignment.jpg
Price-alignment.jpg1920×1200 147 KB

And I want to achieve this:

AFTER-Price-alignment.jpg
AFTER-Price-alignment.jpg1920×1200 144 KB

Many thanks!

Adam

2

@adambiernat ,

select.incubate-collections-add-to-cart-variant-selector {
    text-align: center;
}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->base.scss.liquid

3

@adambiernat ,

Please add this CSS at the bottom of your css file

select.incubate-collections-add-to-cart-variant-selector {
    text-align: center;
}

Thanks!

4

Hi, thank you for your message @oscprofessional @infoatcodelab7 I wasn’t precise enough. I’m looking to align these prices:

Price-alignment.jpg
Price-alignment.jpg1920×1200 147 KB

5

@adambiernat ,

.card-information {
    text-align: center;
}
6

@oscprofessional

I’d like to achieve a result like this:

AFTER-Price-alignment.jpg
AFTER-Price-alignment.jpg1920×1200 144 KB

7

Hi @adambiernat ,

You can follow the instruction below:

  1. Go to Online Store->Theme->Edit code
  2. Asset->/component-card.css->paste below code at the bottom of the file:
.card__heading {
    min-height: 34px;
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

8

@AvadaCommerce thank you so much! Now it looks great!