How To Add Line Border To Blogger Blog Post

Adding line border to your post really helps in getting readers attention, most readers don't want to go along way in reading your articles, they are concern with the tips in your article, which you need a line border to highlight the portion out. border can be added to a single line or to your whole article.


Lets get started :

1. Login to your blogger dashboard

2. Click on "New Post"

3. In the post editor click  Edit HTML

4. Copy and paste the code in the box below, in where you want your line border to appear.


Use the code below for Solid border line.

<div style="border-style: solid;">
<span style="color: black; display: inline ! important; float: none; font-family: Georgia,'Times New Roman','Bitstream Charter',Times,serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19px; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;">
Thanks for visiting Realcombiz.com
<span class="Apple-converted-space">&nbsp;</span></span></div>
 

Use the code below for Double border line.

<div style="border-style: double; border-width: 3px">
    Thanks for visiting Realcombiz.com</div>

Use the code below for Dotted border line.

<div style="border-style: dotted">
    <span style="color: rgb(0, 0, 0); font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19px; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; display: inline !important; float: none; ">
    Thanks for visiting Realcombiz.com.<span class="Apple-converted-space">&nbsp;</span></span></div>

Use the code below for Inset border line.

<div style="border-style: inset; border-width: 3px">
    Thanks for visiting Realcombiz.com</div>

Use the code below for Outset border line.

<div style="border-style: outset; border-width: 3px">
    Thanks for visiting Realcombiz.com</div>

Use the code below for Ridge border line.

<div style="border-style: ridge">
    Thanks for visiting Realcombiz.com</div>

Use the code below for Groove border line.

<div style="border-style: groove">

    Thanks for visiting Realcombiz.com</div>

Use the code below for Dashed border line.

<div style="border-style: dashed">
    Thanks for visiting Realcombiz.com</div>

Hope you enjoy this article, if you have something to say of ask, please use the comment box and don't forget to share this article.

In my future post i will be giving out a lot of tricks/tips on how to give your post a great look. so subscribe now for you not to miss any of this.

Go Social:

Subscribe For Free Updates!

*Please confirm the email sent to your inbox after clicking "Sign Up!".

Follow @realcombiz