How do I center align all headings on my website?

[hitesh469]

Hi, Thank you for your help in advance

I want to center align all headings on the website. I referred to earlier posts on the forum and found a code to be used in the base.css: 

.title-wrapper, .collection__title, .title, .collage-wrapper-title {
text-align: center!important;
}

I have used the above code. It did center align most of the headings except for 2: Collection list title & multi column title. The multi column title was center aligned on the phone but in desktop it is still aligned to the left. I am unable to upload photos here for reference as it keeps saying format not supported here 

Store URL: https://gomyld.com/
password: hiwawa

Please help as soon as possible. It is an urgent requirement. 

[PageFly-Oliver]

Hi @Hitesh469,

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file basecss

Step 3: Paste the below code at the bottom of the file -> Save

h1,h2,h3,h4,h5,h6{
text-align:center !important
}

Hope my solution works perfectly for you.

Cheers!

Oliver | PageFly

[hitesh469]

Hi thank you for the reply. Unfortunately it is not working. The code has merely changed the alignment of the heading used in the image section of the home page. everything else remained the same. 

Instead of a common code for all headings, is it possible to give a code for these two section headings alone specifically: 

Multicolumn section heading &

Collection list heading

Do let me know, thank you. 

[PageFly-Oliver]

You can try a gain

h1,h2,h3,h4,h5,h6{
text-align:center !important;
margin-left:auto !important;
margin-right:auto !important;

}

[grumpycookies]

hiiii, i hope you're still on this forum because i have a question 🙂 this code worked great on Trade theme, but it didn't center the dollar amount of the products. is there more code i could add to help correct this? this is what my page looks like now. i'm working on the site so here is the preview code just in case. https://5jwk7uxlpj45p14n-77911654695.shopifypreview.com

[oscprofessional]

Hello @hitesh469 

You can try this code: it will be helpful to you

Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.

h1, h2, h3, h4, h5, .h0, .h1, .h2, .h3, .h4, .h5 {
    text-align: center !important;
}

[sahrar]

this was the first one to work for me, thanks

[sahrar]

how do i not centre the heading in the footer though?

[ZestardTech · Accepted solution]

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset -> base.css and paste this at the Bottom of the file:

.title-wrapper-with-link {
    justify-content: center;
}