Blogging 101: Removing Drop Shadows from your Images in Blogger

Are you using the "Simple" Template in Blogger? Have you noticed those annoying gray outlines around your images? Are you wondering how to get rid of them?

I tried forever to remove them in the template designer. I gave up convinced that they were an unchangeable part of the template, until my wonderful boyfriend found this super easy css tutorial. And now I don't have any shadows behind all my images!

Here's what you do...

1) Go to your blogger homepage, aka your dashboard.

2) Click on the "layout" tab.

3) At the top of the page, click on the link to "template designer". The template designer will open in a dark gray box at the top, and at the bottom you will see a preview of you blog. 

4) Click "advanced" at the top left, a list of items will open to the right, scroll down and choose "add css"

4) A blank form will open, just copy and past this exact text: 

.post-body img, .post-body .tr-caption-container, .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;}

5) Click "apply to blog" at the top right and your done!

Hope this is helpful to all you bloggers out there!