Center text and prices collections - Debut Theme

JHP_photo
New Member
9 0 0

Hello all, 

I used the following html to center text&price in collections, but I'm not happy with the alignment of my prices (it doesn't seem centred, or is it me?).

Can someone give me advice how to change this?

_________________________________

dl.price.price--listing {    align-items: center;

}

.h4.grid-view-item__title.product-card__title {    text-align: center;    width: 100%;    display: inline-block;

}

_________________________________

Screenshot 2021-04-30 at 21.43.19.png

0 Likes
JHKCreate
Shopify Partner
2492 402 591

The title seems centered, however the price is not as you might have noticed.

Would you mind sharing your store's URL so we can provide a solution for that @JHP_photo ?

Cheers!

- Did we solve your issue? Like & Mark As Solution to help the community
- Should you need any direct help: contact@jhkcreate.com
0 Likes
JHP_photo
New Member
9 0 0

Thanks for being quick JHK!

Uhhmm...I think I have it fixed by adding:

 

.price dd {
margin: 0 -0.5em 0 0 !important;
}

 

Do you agree?

https://jhp-photo.myshopify.com/ 

0 Likes
JHKCreate
Shopify Partner
2492 402 591

Let's have a look! Would still need your store's password as well so I can have a look!

- Did we solve your issue? Like & Mark As Solution to help the community
- Should you need any direct help: contact@jhkcreate.com
0 Likes
JHKCreate
Shopify Partner
2492 402 591

Agreed, looks centered as it should!

- Did we solve your issue? Like & Mark As Solution to help the community
- Should you need any direct help: contact@jhkcreate.com
0 Likes
JHP_photo
New Member
9 0 0

Thanks mate, no worries then. As long as you agree with the html added...

Have a good night!

0 Likes
JHP_photo
New Member
9 0 0

Can you look with me again JHK?

I don't think I changed any code, but the prices are not aligned anymore.

 

I have been adding sections to pages the last days, to see how that works. Didn't do any coding except for adding sections to a new template using the following code. As an example:

{% section 'feature-row-JHP-shoots1' %}

 

 

In Assets >> theme.css you find some code on the bottom to center collection price and title

 

0 Likes