When firefox (3.0.6) renders a png image at certain widths (e.g., 50%), a thin grey line is shown along the left and top edges of the content box. The line disappears at other widths (e.g., 70%). Furthermore, the line doesn't seem to be present in the original image (using gimp to inspect the image).
The phenomenon occurs in the absence of the CSS style markup -- in the HTML example below, the CSS is present to clarify where the grey lines are located -- it seems clear that the grey lines are appearing at the very edge of the content box itself.
I have a hard time imagining this is a bona fide firefox bug and am wondering what concept I'm overlooking or not grasping...
Thanks for your time and any suggestions/thoughts...
The images can be seen here http://datlisp.blogspot.com/2009/02/img-width-tag-and-firefox-rendering-of.html
html:
<html>
<head><title>problems with pngs</title></head>
<body>
<div style="border-color: red; border-width: thin; border-style: solid;
padding: 2px">
<img src="http://imagebin.ca/img/ato4dM.png"
width="50%"
style="border-color: blue; border-width: thin; border-style: solid;
padding: 2px;"/>
</div>
</body></html>