Broadcast Theme - align prices on collection page

[TBS2023]

www.thebodyshop.ca

datsau

I am using the Broadcast theme

I would like to align all my prices box so they are less messy

[Mustafa_Ali]

Go to online store ----> themes ----> go to three Dots ----> edit code ---->find theme.liquid files ----> place the code ---->
under the tag before the body ----->
if this code work please do not forget to like and mark it solution

[B2Bridge]

Hi @TBS2023 , you can follow these steps:

Step 1: Open Online Store → Themes → Edit code.

Step 2: Find component-card.css file

Step 3: Paste this code at the bottom of the file

.product-item__info.body-medium {
  padding-left: 2px!important;
  padding-right: 2px!important;
}

If this is helpful, please let us know by giving us a like and marking it as a solution. Thank you

[TBS2023]

still i have some prices that are not aligned

[Huptech-Web]

Hello @TBS2023

Add this CSS; it will work.

@media screen and (min-width: 750px) { .product-item { display: grid; grid-template-rows: auto 1fr; } .product-item .product-item__info { height: 100%; display: flex; flex-direction: column; align-items: stretch; } .product-item .product-item__info > .product-link, .product-item .product-item__info > .product-link .product-item__price__holder { flex: 1; display: flex; flex-direction: column; align-items: stretch; } .product-item .product-item__info > .product-link, .product-item .product-item__info .product-item__price { margin-top: auto; } }