Remove Picture/Image shadow and Border in Blogger/Blogspot

Hello friends, as we see in blogger posts, Images with default borders in blogspot are annoying. here is the post to help if you want  get rid from this issue. for your attention I have posted a set of images having default blogger boarder and the custom image in the right side which will clearly show you the difference between the default blogger images with border and customized picture after removal of Border.

How to remove image border in Blogger

Please follow the steps to do this setting in your blog so that you will be able to post the actual images without any border in blogger.

  • First of all download your blog template(This is for security purpose only)
  • Now go to template and click on customize
  • Click on Advance and then Add CSS
  • Paste the following code and don’t forget to hit enter after the last line
 .post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
padding: 0 !important;
border: none !important;
background: none !important;
-moz-box-shadow: 0px 0px 0px transparent !important;
-webkit-box-shadow: 0px 0px 0px transparent !important;
box-shadow: 0px 0px 0px transparent !important;
  • Finally click on the Apply to Blog.

Now the blogger images which you gonna post should appear without any border.

Incase if you are unable to do the above process you just go to Dashboard >> Template >> Edit html >> Ctrl+f . Find the below code and delete it.

   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);


Leave a Reply

Your email address will not be published. Required fields are marked *