wkhtmltopdf cutting images in half

Question

I am currently using wkhtmltopdf to generate PDFs from a fairly simple HTML page. This HTML page contains 1 image. For some reason, this image is sometimes cut in a weird way!

Image cut in half

AS the above example shows, this image is cut down the middle, and merged together again.

I tried adding

page-break-inside: avoid;
page-break-after: avoid;
page-break-before: avoid;

To the div the image resides in, and the image itself. Unfortunately, no cookie. There's no pattern that can be found for the images uploaded either. It seems it's not size related, file extension related or otherwise. I'm at a loss here.

Answer 1

So, what I was doing before, was using a div, and the image as background:

background:url("https://example.com/file.jpg");

On some rare occasions (can't seem to figure out why), this fails. A workaround is:

background-image:url("https://example.com/file.jpg");