Solved

How to center title featured products block

Greggy55
Excursionist
26 0 2

Greggy55_0-1713266547665.png

Hello everyone, 

How do I make Featured products and the subheading below it display in the center?

I have tried editing the css and code but I cant find the correct code to center the top portion. Underneath the image I have centered it. 

Thanks!!!

Accepted Solutions (2)

deepaksharma
Shopify Partner
448 63 93

This is an accepted solution.

Hey there @Greggy55 

 

If you are using dawn theme then navigate to Online Stores> Themes> Edit Code

and find the file base.css and paste the below code to the very bottom of the file

 

.title-wrapper--no-top-margin > .title {
    width: 100% !important;
    text-align: center !important;
}

 

if it was helpful do like my answer and mark as helpful

Deepak Sharma || Shopify Developer || Helping eCommerce Stores
- Was my reply helpful? Accept it as solution
- Was your question answered? Mark it as an Accepted Solution.
-CHAT ON WHATSAPP | BUY ME A COFFEE | MAIL ME: ds2305187@gmail.com

View solution in original post

Anshul_arora
Navigator
369 104 72

This is an accepted solution.

Hello @Greggy55 ,

Please add the below mentioned code in base.css file and save.

.collection__title.title-wrapper.title-wrapper--no-top-margin.page-width {
text-align: center !important;
}

After adding code you will get your desired output =>

Anshul_arora_0-1713269677844.png

 

I hope it helps.

Please share if you have any query.

Thank you.

Please remember to like and accept the solution to help other store owners.

For Shopify Design & Development | Custom Coding -Visit Here

View solution in original post

Replies 4 (4)

deepaksharma
Shopify Partner
448 63 93

This is an accepted solution.

Hey there @Greggy55 

 

If you are using dawn theme then navigate to Online Stores> Themes> Edit Code

and find the file base.css and paste the below code to the very bottom of the file

 

.title-wrapper--no-top-margin > .title {
    width: 100% !important;
    text-align: center !important;
}

 

if it was helpful do like my answer and mark as helpful

Deepak Sharma || Shopify Developer || Helping eCommerce Stores
- Was my reply helpful? Accept it as solution
- Was your question answered? Mark it as an Accepted Solution.
-CHAT ON WHATSAPP | BUY ME A COFFEE | MAIL ME: ds2305187@gmail.com
Greggy55
Excursionist
26 0 2

This worked thank you!

Anshul_arora
Navigator
369 104 72

This is an accepted solution.

Hello @Greggy55 ,

Please add the below mentioned code in base.css file and save.

.collection__title.title-wrapper.title-wrapper--no-top-margin.page-width {
text-align: center !important;
}

After adding code you will get your desired output =>

Anshul_arora_0-1713269677844.png

 

I hope it helps.

Please share if you have any query.

Thank you.

Please remember to like and accept the solution to help other store owners.

For Shopify Design & Development | Custom Coding -Visit Here
Greggy55
Excursionist
26 0 2

This is only centering the heading , how do I center the image?