How To Remove Image Border On Blogger Post

How To Remove Image Border On Blogger Post
How To Remove Image Border On Blogger Post

How To Remove Image Border On Blogger Post – Usually the blogger template designer do the settings so all the images that is exist in post has a border or frame.

Seems many bloggers don't like if the images on post has an image border or image frame, this is proven by the sum of this blog visitors entrance with keyword remove image border blog post, how to remove image border at blog post, how to remove image frame on blog post, and other similiar keywords.
Therefore, How To In Blogger try to discuss this.

Remove Image Border On Blog Spot

To remove the image border in images which on post is quite easy, you just simply get rid one line of your template CSS code. However, due to the differences of each template code, it might some difference with the template you use.
To make easier, how to remove the image border on Simple template as default blogger template. Here the following steps:

1. Please login to blogger using your ID
2. Click Design
   
3. Click the Edit HTML sub menu
   
   
4. Do the back up for your template first by clicking Download Full Template
5. Find this following code (remember, it just an example by using template called Simple):

   .post-body img, .post-body .tr-caption-container, .Profile img, .Image img, .BlogList .item-thumbnail img {   padding: $(image.border.small.size);   background: $(image.background.color);   border: 1px solid $(image.border.color);   -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);   -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);   box-shadow: 1px 1px 5px rgba(0, 0, 0, .1); }

6. Change the code, then the code will be as follows:

   .post-body .tr-caption-container, .Profile img, .Image img, .BlogList .item-thumbnail img {   padding: $(image.border.small.size);   background: $(image.background.color);   border: 1px solid $(image.border.color);   -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);   -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);   box-shadow: 1px 1px 5px rgba(0, 0, 0, .1); } .post-body img{   padding: $(image.border.small.size);   background: $(image.background.color); } 

7. Click Save Template
8. Done

Example result (image without border/frame):

Left your comments if this doesn't work. How To Remove Image Border On Blogger Post