How to center logo in the header

Tagged: center header image, center header logo widget

This topic has 3 replies, 2 voices, and was last updated 8 years, 4 months ago by Andykev.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

Posts
December 15, 2015 at 10:38 am #16843
colinjordan
Customer
I am trying to center the logo in the header of the Epik theme. I’ve researched it and found potential solutions by modifying the position code in the stylesheet, using custom CSS, and also in unregistering the right header widget (in conjunction with modifying CSS). Nothing has worked thus far.

The site I’m working on is at http://www.new.cirrusaviation.us. Would someone mind having a look and offering their thoughts on how to do this? Thanks 🙂
December 15, 2015 at 12:38 pm #16844
Andykev
Customer
Hi!

Do this:
```
//* Remove the header right widget area
unregister_sidebar( 'header-right' );
```
(I added the .css below w/o doing the remove header widget and it worked, so try)

Add this to your .css
```
/* Full width header, no widgets */

.title-area .site-title a {
    background-position: center center!important;
    float:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
}
```
December 15, 2015 at 1:11 pm #16845
colinjordan
Customer
Genius! I tried putting it at the end of the stylesheet at first, but no luck. Then tried adding it to custom CSS and BINGO, worked like a charm! THANK YOU, AndyKev!
December 15, 2015 at 2:32 pm #16846
Andykev
Customer
You’re welcome!

At a minimum, you could simplify it by only using this part:
```
.title-area .site-title a {
  background-position: center center!important;
  
  }
```
The float and margin may not be necessary for all themes.
Author

Posts

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘How to center logo in the header’ is closed to new replies.