How to Remove Borders from Images in Your Blog

Do you wish you could quickly remove the border around an image you place in your blog post? It's easy to do on the fly.

• Insert your picture using the little "Add Image" icon at the top
• Look at the code produced for the image, and find: … style="float:left;margin:0 10px 10px 0;cursor:pointer; …
• Type "border:0;" before the word "margin" - don't forget the semi-colon (;) at the end
• Your code should now look like this: … style="float:left; border:0;margin:0 10px 10px 0;cursor:pointer; …

You can put the border specification in the template html if you want to eliminate borders from all post images. Locate the following code:

.post img {
padding:4px;
border:1px solid $bordercolor;
}

and change the border pixels to 0px.

Also, if you want the image moved down to be more level with the text, add "padding-top:30px;" after the border code.

So now your code would look like this: … style="float:left; border:0;padding-top:20px;margin:0 10px 10px 0;cursor:pointer; …

►  Take a look at some of our other interesting posts, such as Easy Steps to Insert AdSense Ad in Each Blog Post