Debut Theme - Center Price Collection/Product Grid

Solved
shopralphies
New Member
7 0 0

Hi --  I am using the debut theme on my store: https://2nwvwsttnuwddicf-42474766501.shopifypreview.com 

Ever since I added the hover effect to my images on the collection page (linked above) I cannot figure out how to center the price. I was able to center the title, but not the price. Any suggestions?!! It's driving me crazy.

Thanks so much for the advice. 

 

 

0 Likes
Guleria
Shopify Partner
1255 263 346

This is an accepted solution.

Add this css

.template-collection dl.price {
    text-align: center;
    display: block;
}
Want to modify or custom changes on store hire me.
Email: guleriathakur43@gmail.com, Skype: navrocks1
If helpful then please Like and Accept Solution.
If you are happy and want to donate Click here (Its my paypal)
0 Likes
Wahab_Ahmad
Shopify Partner
693 110 158

@shopralphies,

 

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste below code at bottom of file
 
.price{
display:block !important;
}
 
 
Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: wahabahmadghori@gmail.com

 

0 Likes
shopralphies
New Member
7 0 0

This worked perfectly! Thank you so much. 

0 Likes
shopralphies
New Member
7 0 0

@Guleria 

Is there any way to have this also apply to the prices under the items in the 'you may also like section'? But keep the price above the add to cart as is. 

https://2nwvwsttnuwddicf-42474766501.shopifypreview.com 

0 Likes
Guleria
Shopify Partner
1255 263 346

This is an accepted solution.

Add this css

.product-recommendations__inner dl.price {
    text-align: center;
    display: block;
}
Want to modify or custom changes on store hire me.
Email: guleriathakur43@gmail.com, Skype: navrocks1
If helpful then please Like and Accept Solution.
If you are happy and want to donate Click here (Its my paypal)
0 Likes
shopralphies
New Member
7 0 0

Perfect -- can't thank you enough for your help!!! 

0 Likes
Robeanhood
New Member
7 0 0

need help on the same problem, i have tried quite a lot of solutions in the forum but nothing seemed to be working. the price are still aligned left no matter what

https://robeanhood.myshopify.com/

pass 123456

0 Likes
Guleria
Shopify Partner
1255 263 346

Use this one

.template-index dl.price.price--listing, .template-collection dl.price.price--listing{
    display: block;
}
Want to modify or custom changes on store hire me.
Email: guleriathakur43@gmail.com, Skype: navrocks1
If helpful then please Like and Accept Solution.
If you are happy and want to donate Click here (Its my paypal)
0 Likes
Robeanhood
New Member
7 0 0

it is not working

 

0 Likes