title: firefoxs renders thin grey lines at content box edges of a png at certain widths - why?
body: <p>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).</p>
  
  <p>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.</p>
  
  <p>I have a hard time imagining this is a bona fide firefox bug and am wondering what concept I'm overlooking or not grasping...</p>
  
  <p>Thanks for your time and any suggestions/thoughts...</p>
  
  <p>The images can be seen <a href="http://datlisp.blogspot.com/2009/02/img-width-tag-and-firefox-rendering-of.html" rel="nofollow noreferrer">here</a> <a href="http://datlisp.blogspot.com/2009/02/img-width-tag-and-firefox-rendering-of.html" rel="nofollow noreferrer">http://datlisp.blogspot.com/2009/02/img-width-tag-and-firefox-rendering-of.html</a></p>
  
  <p>html:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;&lt;title&gt;problems with pngs&lt;/title&gt;&lt;/head&gt;
  &lt;body&gt;
  &lt;div style="border-color: red; border-width: thin; border-style: solid;
        padding: 2px"&gt;
  &lt;img src="http://imagebin.ca/img/ato4dM.png"
      width="50%"
      style="border-color: blue; border-width: thin; border-style: solid;
      padding: 2px;"/&gt;    
  &lt;/div&gt;
  &lt;/body&gt;&lt;/html&gt;
  </code></pre>