MPDF full page background

Question

I spent way too much time on this and I can't figure out a good 21th century solution.

Simply I have to generate a business card in PDF with a background image, but MPDF isn't very helpful.

By default I had:

@page{
    sheet-size: 90mm 55mm;
    margin: 0;
}

I tried to:

• use @page{ background-size: 100%; } doesn't work
• use @page{ background-size: cover; } doesn't work
• resize the image - even if I set the right size in 'mm', it will be smaller or larger, even if I set the background-image-resolution to the same value as the image.
• place absolute positioned div with background image
• same but with img tags, using src attribute.

At the last option, I've got a really strange thing. It showed the whole image but in a small rectangle in the pages, but not even in full height.

Does anyone have an idea, how to simply use an image as a page background?

Answer 1

mPDF has a custom css property for background images: background-image-resize with custom values from 0-6:

• 0 - No resizing (default)
• 1 - Shrink-to-fit w (keep aspect ratio)
• 2 - Shrink-to-fit h (keep aspect ratio)
• 3 - Shrink-to-fit w and/or h (keep aspect ratio)
• 4 - Resize-to-fit w (keep aspect ratio)
• 5 - Resize-to-fit h (keep aspect ratio)
• 6 - Resize-to-fit w and h

So you probably need: body {background-image:url(something.png); background-image-resize:6}

Taken from mPDF docs