Hi meganme517
css:
#masthead .site-branding img
{
margin:0 auto;
}
Thanks for the quick response. I tried this and it did not work. Also added in align: center to that and that didn’t work either. Any other suggestions to try?
Just to clarify, this is in the regular CSS not anywhere in the folder css, correct?
Do not edit the core files. If you update our future updates all your changes will go..
Go to Appearance -> Theme Options -> Tools
Put this CSS in the Custom CSS field
#masthead .site-branding{
float:none;
text-align:center;
}
With this edit the header text will appear below the logo. If you are ok with it then its great. Or if you don’t want to display the header text then add this additional CSS
#masthead .right-header{
display:none;
}
containing div needs to be full width and image to be display:block try:
#masthead .site-branding
{
float: left;
padding: 15px 0;
width: 100%;
}
#masthead .site-branding img
{
margin: 0 auto;
display: block;
}
Ah, OK. Tried both of those in the theme options custom css and still doesn’t center the logo – http://www.benchguru.biz/
@meganme517:
Look for:
#masthead .site-branding {
float: left;
padding: 15px 0;
}
And replace it with:
#masthead .site-branding {
float: left;
width: 100%;
}
Note that with the change above, you will need to also make changes to where you phone number is as this change will affect that.
Unless you saved your CSS elsewhere, you should be able to make changes in Appearance > Editor > style.css.
Still nothing. Do I need to put an !important anywhere?
@meganme517
Whoops, the float need not be there so this should work:
#masthead .site-branding {
width: 100%;
}
#masthead .site-branding img {
display: block;
margin: 0 auto;
}
@meganme517
I took a look at your CSS and it doesn’t have margin: auto. Currently it is:
#masthead .site-branding img {
height: auto !important;
width: auto !important;
display: block;
}
Update it to:
#masthead .site-branding img {
height: auto !important;
width: auto !important;
<strong>display: block;</strong>
}
