function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
etoeto 

background image issue with pdf generation

Hi,

 

 

I try  to include static ressources as background images, however the background images are far too large.

 

 

E.g. I have a logo with 500 pixel at 100pixels/cm (which would be 5cm) and I include it using css:

 

 

background-image: url('logo');

 

 

Then this image will be rendered as a (approx.)  15cm background image.  It seems to me, the pdf renderer does completely ignore the size/resolution information within an image for background images, but always uses 72pixel/inch or something like that. 

 

as it doesn't make sense to resize them to 120 pixel (which would be extremely blurry), is there any way

how I can force background images to be included with the right resolution?


 

 

Message Edited by eto on 01-28-2009 02:31 PM
Best Answer chosen by Admin (Salesforce Developers) 
etoeto

layered elements do work (just use z-positioning), however this does not solve the issue in every case, e.g. not, if you try to include the background image in the header or footer.

 

 

just for your convenience, here is some code which uses layers and should help in most cases:

 

 



<img src="{!$Resource.logo}" style="position: fixed; left: 4.5cm; top:10cm; z-index:-1" width="10cm">

All Answers

JeremyKraybillJeremyKraybill

I just tackled this exact same issue and could not come up with a solution other than physically resizing the background image. It was OK for me, although as you point out the printed fidelity of images in generated PDF's leaves a bit to be desired.

 

If you find any alternative solution, please let me know; the only idea I had which I didn't try was using layered div's to allow resizing via the img tag.

 

Jeremy Kraybill

Austin, TX

etoeto

layered elements do work (just use z-positioning), however this does not solve the issue in every case, e.g. not, if you try to include the background image in the header or footer.

 

 

just for your convenience, here is some code which uses layers and should help in most cases:

 

 



<img src="{!$Resource.logo}" style="position: fixed; left: 4.5cm; top:10cm; z-index:-1" width="10cm">

This was selected as the best answer
Reppin__505Reppin__505

Two thumbs up Eto. This really helped me out.

 

:smileyhappy:

 

Thanks.

DaveIngramDaveIngram

Hi

is there any way to make this work with a tiled image?