Issue getting page titles to center

I have googled this and checked the forum and found about 5 different pieces of code that have helped people center their page titles, but I have had issues getting the code to work for me. (EDIT: the Contact page has the title centered, I didn’t think it was; only the Shop and About pages are not centered).

Here is my website: https://www.elbelfarms.com

One other thing, it seems like the title for the About page is smaller font size than the other pages, why?

Another Edit, I was able to get the About page to center and the title is now the same size as others, I did this by going under Quick Edit and changed the Template to Default. I guess at some point I must have changed it.

I still need the Shop page centered and I am looking into how to insert a linebreak to separate the items currently listed from the Shop page title.

hey there

Hope you are having a good day and thank you for your question :slight_smile:
Please add this CSS in appearance - customize - additional CSS

.page-title {
text-align: center;
margin-bottom: 20px !important;
}

Thanks!
Colorlib Support Team

Noda,

The code you gave me does not entirely center the Contact and About pages, but does work for the Shop page. On the About and Contact pages they are centered, but not completely. See images below and/or go to my website now.

With the previous code here is what the Contact page looked like, see Original Contact. The code to have it appear like that was:
h1.entry-title {
text-align: center;
}

With the code you gave me see the New Contact attachment or go to my website as it is now. It is centered, but I prefer how it was originally. The only issue with the previous code was it did not work at all for the Shop page, whereas your code works perfect for the shop page, but not for the others.

Thanks,

Justin

Good morning :slight_smile:

Ok, let’s move on please add this codes now:

header.entry-header {
text-align: center;
}

Noda,

That didnt work, at least not for the Shop page, it was unaffected by the different code.

Thanks,

Justin

Good morning

Weird, add this code too:

.page-title {
text-align: center !important;
}

Noda,

Thanks for the help.

When I put the following code altogether it worked.

header.entry-header {
text-align: center;
}
.page-title {
text-align: center !important;
margin-bottom: 20px !important;
}

Good evening

Well, that’s true :slight_smile:
is there anything else?

Noda,

That is everything regarding this issue.

Thanks,

Justin

I will close this case now, Feel free to contact us again if you have other questions

Thanks!