Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
I have tried every code available on this forum for centering the site title, still nothing works. Can someone explain how I can do this. I am using Vantage premium and coping the code into the custom css of the child theme does nothing. Please help and thanks.
I would like to know this also, so I’m posting so I can receive notification when an answer is posted. :)
Ditto–^
Ditto–^
Hi JOYCE and everyone. The confusion here is that Appearance > Customize > General > Center Logo is just that, it only centers the logo. Apologies for the confusion here. To center your site title add the following to Appearance > Custom CSS:
Let me know if you need a further hand with that.
Thanks for your reply and the code but unfortunately it doesn’t work. Below is the whole code in my custom css:
/* Vantage Center Site Title Center Support Text */
header#masthead .hgroup h1 {
text-align: center;
}
header#masthead .hgroup .support-text {
text-align: center;
margin-top: 30px;
margin-bottom: 30px;
max-width: 100%;
position: initial;
width: 100%;
}
/* Vantage Center the main menu */
.main-navigation ul {
text-align: center !important;
}
.main-navigation ul li {
display: inline-block !important;
float: none !important;
}
Please let me know what I need to do?
Thanks
For this particular case where you’re not using the header text field, please remove your custom CSS that pertains to centering in the header and try the following instead:
Thanks for your reply; followed your instructions but nothing works. Here is what is in the custom css:
* Vantage center the site title and hide support text */
header#masthead .hgroup .logo {
float: none;
}
header#masthead .hgroup h1 {
text-align: center;
}
header#masthead .hgroup .support-text {
display: none;
}
/* Vantage Center the main menu */
.main-navigation ul {
text-align: center !important;
}
.main-navigation ul li {
display: inline-block !important;
float: none !important;
}
Your Custom CSS is missing an opening forward slash before the first asterisk. This will unfortunately cause the CSS to not work.
Please take a look at the CSS I posted last and compare it to yours. Should do the trick.
thanks a lot that has resolved the problem.
For sure, glad that helped.