Nerd Party: Centering a post footer in Blogger

Clarissa asked “Hey Sarah, I’ve been wanting to center my post footer (where it says comments, labels, etc) for a long time. Do you know how?”

Well Clarissa, you’re in luck because I do! And this one isn’t too complicated.

There is an invisible box surrounding the post footer called a div. Just like there is a box around each post, around the content column, around your sidebar and around the entire blog itself. (You just earned 10 nerd points for understanding that one!) All you have to do is tell that div that the text inside it should be centered (or aligned to the right or left).

First, search through the HTML code to see if the post-footer div is being identified within your theme.  (To quickly search hit ctrl F or command F and type post-footer) If it is, you’ll just need to add or edit the following piece of code:

.post-footer {
text-align: center;
font-family: ‘Port Lligat Sans’, sans-serif;
font-size: 18px;
padding-top: 5px;
padding-left: 0px;
padding-bottom: 2px;
border-bottom: 1px solid #c7c5c5;
}

If this piece of code is not already in your template, you can add it:

.post-footer {
text-align: center;
}

Now, all Blogger templates should already include the post-footer tag, but if you’ve purchased a premade template or have a custom design it may not be called the same thing. You can use the Web Developer tool to see what the div around those elements is called.

And remember to save a copy of your template just in case anything goes wrong :)

Who else has a question?

* If you like those dots you can buy the Hello Dottie template in my shop!

CLICK HERE FOR MORE NERD PARTY POSTS

Share/Bookmark