Question

THIS QUESTION IS SOLVED — can’t post an answer to my own question on account of newb status.
Had more than one file and was using the wrong file path. User error 🙂

I using an email template from MailChimp and I’m substituting a client logo in the title bar for the the gear icon. Here’s my logo in the simplified form of a circle with bezelled bottom edge followed by the original gear icon.
I'm not allowed to post images yet http://dl.dropbox.com/u/1585739/bze_html_nl/images/header-bg%20with%20gear%20and%2072px%20circle.jpg

Yet when I load it into the browser I get this: Yuk http://dl.dropbox.com/u/1585739/bze_html_nl/images/Yuk.png

The circle and the gear have very similar RGBA values so far as I can see in PS.

I don’t think this is any kind of CSS shadow-effect but why is it tearing? (I haven’t done much web work before but 30 years of Design and DTP. I’m pretty green re web nuances so far).

Remember this is for an HTML-email so those ‘standards’ apply 🙂

HTML/CSS Source

<–! EDIT–>
Here is a link to the original “gear” image. It is a .png with alpha, not a .gif btw. Gear http://dl.dropbox.com/u/1585739/bze_html_nl/images/19gear.png
My PNG file made in PS with alpha: PNG file http://dl.dropbox.com/u/1585739/bze_html_nl/images/bze-72px.png

Answer 1

The image you provided later is different than in the site that you have shown where there is white stuff at the edges of that circle..

Shows both images in a dark background. jsfiddle – jsbin (jsfiddle is being slow..)

Left Circle = The one in this url – Has that extra white stuff.

Right Circle = The one you gave later on as the “PNG file” – Doesn’t have extra white stuff.

---

Conclusion would be that you are using the wrong image..