How can I center product titles and prices in the Debut theme?

Store Design
1

Hi,

How do I centre the product titles and prices on both the ‘Featured Collections’ on the Home tab and all the products on the Catalogue tab? I’m using the Debut theme. My shop is onyx-and-elm.myshopify.com

Thanks.

1 Like
2

@shelleyd
hi,
welcome to Shopify Community.
Your Store is password protected kindly Share your Store Front Password.

So that we can help you.

Thank you.

3

Hi
Your store is password protected. Please share frontend password.
You can do this by using custom css. If you have css knowledge you can do this easily.

1 Like
4

Thanks. It’s KZ-vdHfR-eASE85

5

Dbuglabpvtltd_0-1641363604061.png
Dbuglabpvtltd_0-1641363604061.png1105×530 5.77 KB

incorrect pasword

1 Like
6

Sorry, it’s aulick

7

Hi
use this css it would work for you.

#shopify-section-featured-collections .grid.grid–uniform.grid–view-items li .price.price–listing .price__regular {
width: 100%;
}
#shopify-section-featured-collections .grid.grid–uniform.grid–view-items li {
text-align: center;
}

1 Like
8

Dbuglabpvtltd_0-1641365069688.png
Dbuglabpvtltd_0-1641365069688.png1223×361 193 KB

will look like this.

1 Like
9

Thank you. Do I just add this code to the end of the theme.css page?

10

yes

1 Like
11

It worked perfectly. Thank you!

12

Sorry, it has centred the titles on the Home page, but not on each of the individual collection pages. Is there a way to do this too?

13

Hi @shelleyd

Please remove ID from the css then it will work on every page.

Dbuglabpvtltd_0-1641367647091.png
Dbuglabpvtltd_0-1641367647091.png761×243 13.5 KB

3 Likes
14

I’ve looked, but I can’t work out how to do this. Where do I find the ID?

1 Like
15

Hi @shelleyd

You added that css code which was sent to you.

Just replace that code with this one.

.grid.grid–uniform.grid–view-items li .price.price–listing .price__regular {
width: 100%;
}
.grid.grid–uniform.grid–view-items li {
text-align: center;
}

16

It’s working perfectly now. Thanks!