Alternative to object-fit with wkhtmltopdf

Question

I am currently trying to export html pages to pdf using wkhtmltopdf, but the object-fit I use to force my images into a square doesn't work; the images end up stretched to fit the square box instead of being cropped properly.

I know for a fact that object-fit doesn't work with wkhtmltopdf, and I've been looking for workarounds (cf Object-fit: cover; alternative? ) but :

• I cannot access the image directly since it's used in a template (for the background method)
• I have no easy way to differentiate between horizontal or vertical images

here's the current snippet I have that doesn't work (works fine on the html though):

  .class .img-box {
    width: 44px;
    height: 44px;
    margin-right: 10px;
    display: inline-block;
    vertical-align: middle;
  }

  .class .img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

I'm at the point where I start getting a little upset by this, so if anyone knows about a working solution, I'd be glad to know about it. Thanks

Answer 1

Try this

<div style="width: 100%;height: 100%;background-image: url();background-size: contain;background-position: center center;background-repeat: no-repeat;"></div>