Beautify Your Blog || Center Your Header


A few weeks ago I helped host a blogger round table all about blog design. There seemed to be a lot of the same questions from bloggers - they all wanted a simple fix for similar problems. Rather than just share it with the few ladies at the round table, I wanted to share it with all of you. So here we are with my new mini-series beautify your blog. Today's topic? Center Your Header!


For most templates and layouts - the header automatically sets to the left. Today I am going to give you a few simple steps to center your header behind or instead of the title and description. 

1. In the left sidebar of your blogger dashboard click "Template".
2. Under the Live on Blog thumbnail click "Customize".
3. In the left sidebar of the customize dashboard click "Advanced".
4. Scroll down to the last advanced option - "Add CSS"
5. Add the following code to the "Add Custom CSS" Text box:

To center your header INSTEAD of Title and Description:
#header-inner img {
margin-left: auto;
margin-right: auto;

To center your header BEHIND the Title and Description:
#header-inner {
margin-left: auto;
6. Click "Apply to Blog".
7. You're good to go! Have a happy day!

What tutorial would you like next? Anything you want to learn to beautify your blog?

-don't forget to enter the Blog Design giveaway-

Kaylin said...

This is so helpful. I have wondered this forever!!!

Brooke @ Silver Lining said...

YES. It kind of bugs me when I see uncentered blogs, or just people who are learning about the aesthetics of blogging in general. My blog was definitely like that back in the day though!

Tayler Morrell said...

How to get that "pop up bar" at the top of your blog. Your's is for following you on Bloglovin.

Cece said...

Love this! I actually made a header for my husband (he's written exactly one post) and since it was off center I actually re did the header off center so that it would look right. I'll save this for future reference.

© Deidre Emme. Design by Fearne and Breezy & Co.