Showing posts with label grey. Show all posts
Showing posts with label grey. Show all posts

Thursday, February 12, 2009

IMG 'width' tag and firefox rendering of png images

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...

Below are the: (1) original image, (2) the image with the grey line (width 50%), and (3) the image w/o the grey line (width 70%)...

The html:


...
<div style="border-color: red; border-width: thin; border-style: solid;
padding: 2px">
<img src="http://path/to/original.png"
width="50%"
style="border-color: blue; border-width: thin; border-style: solid;
padding: 2px;"/>
</div>
...



Original: