I want to center my featured collection heading or title on impact theme

Store Design
1

Hi everyone… since i have tried a lot of codes regarding centering the featured collection title or heading but none of it worked for me on impact theme… i would really appreciate if someone could help me with it…
thank you

2

Hi @syedfaaz58

Would you mind to share your store URL? Thanks!

3

Sure it’s ( www.abayatrendz.com )

4

Thanks for the info, just like to clarify. You like to center only the feature product section including the collections and discount prodcut.

Do you mean this one right?

Made4uoRibe_0-1715101360486.png
Made4uoRibe_0-1715101360486.png826×289 36 KB

This code is to center the headings.

From your Shopify admin dashboard, click on “Online Store” and then “Themes”.

Find the theme that you want to edit and click on “Actions” and then “Edit code”.

In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

section-header.section-header {
    display: flex;
    justify-content: center;
}

And Save.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

5

I really appreciate that… But it didn’t worked for me unfortunately :cry: …

6

Hi @syedfaaz58

Hope my solution can help you:

- Step 1: Sale channel => Online Store => Themes => Edit code:

view.png
view.png1732×842 83.4 KB

- Step 2: Search for theme.css and add the css directive to the end of this file:

section-header.section-header {
    display: block!important;
    text-align: center;
}

–

result:

view.png
view.png1202×705 178 KB

I hope these instructions will help you. If they are helpful, don’t forget to like and mark as the solution.

Have a nice day sir!

7

Hi @syedfaaz58

Hope my solution can help you:

- Step 1: Sale channel => Online Store => Themes => Edit code:

BSSTechFusion_0-1715161436833.png
BSSTechFusion_0-1715161436833.png399×194 20.2 KB

- Step 2: Search for theme.css and add the css directive to the end of this file:

section-header.section-header {
    display: block!important;
    text-align: center;
}

–

result:

BSSTechFusion_1-1715161436835.png
BSSTechFusion_1-1715161436835.png400×235 40.3 KB

I hope these instructions will help you. If they are helpful, don’t forget to like and mark as the solution.

Have a nice day sir!

8

it really worked for me… thanks a million sir :hugs:

9

I have the same problem with the Impact theme. When I use this code, the text is centered in the Firefox browser but not in the Chrome or Edge browsers.

How can that be?