Forum Moderators: not2easy
For a great many reasons, I like to present most of the images on my sites as CSS background-image properties, as opposed to <img/> elements.
This is great for screen display, but Firefox does poopy things with printouts.
I use a media="Print" link to import a "pretty print" stylesheet.
The thing that FF does is display background-image images at a lower DPI than the rest of the page, so they display bigger, but it crops them at page DPI. I can show an example, but not here.
I would consider this a bug, but it's been in there for a while. It seems to be fixed in Beta 3, but I haven't done enough testing to know for sure.
I've looked at the Mozilla Extension Properties Page [developer.mozilla.org], but I didn't see anything in there about it.
Any ideas for workarounds?
The thing that FF does is display background-image images at a lower DPI than the rest of the page, so they display bigger, but it crops them at page DPI. I can show an example, but not here.
I've only really experimented with this in FF1.5 (don't have access to FF2 at the moment), but in my experience the background image always prints smaller! As if the image is not scaled at all, literally printed pixel for dot!?
You may be aware, but worth baring in mind that background images do not normally print at all (browser default).
I've only really experimented with this in FF1.5 (don't have access to FF2 at the moment), but in my experience the background image always prints smaller! As if the image is not scaled at all, literally printed pixel for dot!?
I've just tried printing background images from FF2 (Windows) and they seem to print fine. In correct proportion to the rest of the page. (Much better than FF1.5!) Bare in mind that a 600px wide image almost fills an A4 printed page. I have my screen set at a normal 96 dpi, if that makes a difference?
I would agree that CSS is preferable, but unfortunately an <img> tag has a better chance of printing.