Creating A Margin/Post Divider Between Two Posts For Your Blog

Creating A Margin/Post Divider Between Two Posts For Your Blog

In this lesson we will discuss about creating a margin between two posts for your blog and this is really important because it will provide an user friendly interface to your readers.

For example just look over our test blog in the image below without any margin between two posts:

Creating A Margin/Post Divider Between Two Posts For Your Blog

Now see that between 'Test Post 3' and 'Test Post 2' there is no margin and not looking professional and user friendly. Now have a look over the image below with margin between these two posts:

Creating A Margin/Post Divider Between Two Posts For Your Blog

.

Now I have created a thick margin or border between these two posts and now it is become easier to differ between the posts. This is very simple to do with adding a CSS (Cascade Style Sheet) code to your theme.
Step 1-Sign in to your blogger dashboard, go to 'Theme' and then 'Customize' as marked with red border in the given image.

Creating A Margin/Post Divider Between Two Posts For Your Blog

Now you will see this

Creating A Margin/Post Divider Between Two Posts For Your Blog

Step 2-Go to the 'Advanced' option and you will see a couple of options are available there like
'Page Text', 'Backgrounds', 'Blog Title', Post Background etc. Scroll down to the Add CSS option as described in the image below.

Creating A Margin/Post Divider Between Two Posts For Your Blog

Step 3-Just copy and paste the following code in the white blank space and hit 'Apply to Blog' located at right top corner of this page, and you are done. Now take a look to your blog, you can see that the margin has been created between two posts.
Your code goes here:

.post { border-bottom: 5px solid #000000; padding-bottom: 10px; margin: 10px 0px 10px 0px;}

You can also change the margin color, thickness and padding by changing the values within the code.For here the border bottom is 5px (5 pixels), changing this value will change the thickness of the margin, changing 'solid' to 'dotted' will show up a dotted margin, if you want to change the margin color then change the '#000000' value. Happy blogging.