How to Remove Border and Shadow Around Images in Blogger

How to Remove Border and Shadow Around Images in Blogger
If you are using Blogger as your blogging platform, you’ll notice that every time when you insert an image in your blog post, it will contain border and shadow around it by default. And while there's nothing wrong with this, but if you find this annoying or it simply messes up with your blog’s theme, you may follow the guides below on how to remove the border and shadow. There are several ways to accomplish this and we’re going to modify the CSS entry in Blogger. With this method, the changes that you’ve made will be applied to the entire posts of your blog without needing to edit each of the blog post manually.

On your Blogger dashboard, select Theme, Customize. Under the Blogger Theme Designer, click on Advanced, scroll down and select Add CSS. Copy and paste the following codes in the custom CSS area.

.post-body img, .post-body .tr-caption-container, .ss, .Profile img, .Image img,
.BlogList .item-thumbnail img {
  padding: none !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;
}

Click on Apply to Blogger and the border and shadow around images in your blog will be removed by now. It's really that simple. Is this method working for you? Please feel free to leave your comments in the comment section below. Thanks for reading.


EmoticonEmoticon