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!!!
Topic summary
Goal: Center the “Featured products” section title and its subheading in a Shopify store.
-
A solution for the Shopify Dawn theme was provided: add CSS in base.css targeting the title wrapper to set text-align: center (and width: 100%). The store owner confirmed this successfully centers the title.
-
An alternative CSS selector was also suggested to center the title within a specific wrapper configuration. A screenshot was shared to demonstrate the outcome.
-
Latest update: The title is centered, but the associated image beneath remains left-aligned. The store owner asked how to center that image as well.
-
Technical note: Changes involve editing base.css and applying CSS selectors to the title wrapper (e.g., .title-wrapper–no-top-margin > .title and a combined selector for .collection__title/.title-wrapper). These rules affect text alignment for headings; they do not target product images.
-
Status: Partially resolved. Title centering works; centering the image is still unresolved and requires additional CSS targeting the image/container. Screenshots were used to illustrate results.
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
1 Like
This worked thank you!
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 =>
I hope it helps.
Please share if you have any query.
Thank you.
1 Like
This is only centering the heading , how do I center the image?