How to Remove Image Shadows in Blogger

After reading through my tips on cleaning up your blog, a few people asked for instructions on how to remove image shadows in Blogger. There are two ways to do this – one is by adding a bit of CSS and the other is by removing it.

ADDING CSS: Under Design > Template Designer, click on advanced and then scroll to the bottom and click Add CSS. In the box paste this bit of code. If you would like to keep the borders and padding you can take those two lines out.

DELETING CSS: Under Design > Edit HTML. Use Ctrl F or Apple F to open the finder window on the bottom of your browser. Type in .post-body img until it finds the following piece of code or something very similar depending on your template. Remove the bolded lines of code. Preview your template and then save. You can also remove the line that adds the border or change it to say 0px.

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

Click here for more Nerd Party posts & to submit your questions

Share/Bookmark