How to Add Rounded Corners to Your Blogger's Blockquote

In this post, I am going to share with you a simple way to create a rounded blockquote for Blogger's blog. Previously, I already shared with you the way to "Add Blockquote to Blogger's Blog" and then I shared with you "How to add shadow to Blogger's Blockquote".  I hope both of the posts are helpful for you.

In this post, I will share with you "How to Add Rounded Corners to Blogger Blockquote". I always wanted to get a rounded blockquote for blogger's blog and I think that it is quite cool. Finally, I found the answer. If you like rounded blockquote for blogger's blog, please read on to get the codes.


First of all:
If you are following my previous post to create customized Blogger's Blockquote, then find your codes just like below:

Blogger's Blockquote with Shadow:

blockquote {
background: #FFFFCC;
margin-left: 10px;
margin-right: 10px;
margin-top: 5px;
margin-bottom: 5px;
padding-left: 10px;
padding-right: 10px;
padding-top: 10px;
padding-bottom: 10px;
width: 450px;
height: auto;
border: 2px dotted #FFCC66;
text-align: left;
font-style:italic;
color: #6e6e6e;
-moz-box-shadow: 0px 5px 15px #ccc;
-webkit-box-shadow: 0px 5px 15px #ccc;
box-shadow: 0px 5px 15px #ccc;
}

Note:
I suggest you find the word "blockquote". You can use the shortcut key "Ctrl + F", then find "blockquote".  It would be faster for you to find the codes.

Secondly:
Add the codes below to your codes:

Rounded Corners Coding:

-moz-border-radius: 15px;
border-radius: 15px;

After you add in the codes, you new "blockquote" codes will look like codes below:

Blogger's Blockquote with Shadow and Rounder Corners:

blockquote {
background: #FFFFCC;
margin-left: 10px;
margin-right: 10px;
margin-top: 5px;
margin-bottom: 5px;
padding-left: 10px;
padding-right: 10px;
padding-top: 10px;
padding-bottom: 10px;
width: 450px;
height: auto;
border: 2px dotted #FFCC66;
text-align: left;
font-style:italic;
color: #6e6e6e;
-moz-box-shadow: 0px 5px 15px #ccc;
-webkit-box-shadow: 0px 5px 15px #ccc;
box-shadow: 0px 5px 15px #ccc;
-moz-border-radius: 15px;border-radius: 15px;
}

Finally:

All you need to do is to click "Save the Template". That's it!

Done. Now, you can go ahead and add your blockquote, you will find that the blockquote is now having rounded corners.

I hope you can implement the codes correctly. If you find any difficulties, please let me know.

Have fun and enjoy!

Earn Money From Blog Recommends:
Confession of a Lazy Super Affiliate Chris Rempel
Personally, I bought this ebook and I find that it is very useful and very informative. I am now trying out his methods and I will be making some great income soon.

I will show you my earnings using his methods as soon as I got paid. You would want to read about it. The ebook is being sold at a good price. Grab it and learn the technique.

I Really Very Recommend This Ebook! Never before I found such an informative ebook.