Tutorial and Freebie: Post Dividers

Here's a nice tutorial with a corresponding freebie, just for you.

How to add Post Dividers to your blog

*note: the divider below is already hosted on Photobucket. Other dividers may require you to host them yourself. If so, just copy the "direct link" URL to use.*

1) In your HTML, find the following code:

{image from Shabby Blogs}

2) Replace the circled code with this:
.post {
background: url(http://divider-url.jpg);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
border-bottom:0px dotted $bordercolor;
padding-bottom:5.5em;
}

3) Replace where the code says "http://divider-url.jpg" with the URL of your divider.

4) Preview and save if you're happy! Enjoy!

****

Here's the freebie. :) It will work with blogs whose main post area is 600 px or wider.

URL: http://i933.photobucket.com/albums/ad172/RobinBlogs/div1.png