background-color property is not working

[rbgpt]

[dorklord23]

I had similar case with yours. My solution is to add a new selector that pinpoint to the element you want to style. Not its parent, but the element itself. Forget about inheritance when it comes to background-color and color in html-pdf.

[adamreisnz]

@dorklord23 can you clarify that with an example? I am not using any inheritance and styling a div directly, yet background-color is completely ignored.

[narendra315]

Faced similar issue, fixed it by giving the html element inline style <div style="background:#007bff;">

[stormfar]

The above does not work for me.

[dangear]

Try this in your css file

@media print
{
  .body {
    background: #00BAFF;
  }
}

[stormfar]

After trying this again, I discovered that adding !important worked for me, with the class selector solution. Did not need @media print.

[jnaklaas]

@media print nor adding !important are working here. Using bootstrap and trying to use the .table-striped css class.

[softmantk]

@jnaklaas did you find solution?

[jnaklaas]

@softmantk no I haven't.

[softmantk]

I had similar case with yours. My solution is to add a new selector that pinpoint to the element you want to style. Not its parent, but the element itself. Forget about inheritance when it comes to background-color and color in html-pdf.

This worked for me.

[ThibaudREY]

Adding html { -webkit-print-color-adjust: exact; } in my css worked for me.

[damienbry]

@ThibaudREY thanks it worked for me I didn't know the existence of color-adjust CSS property I was struggling with another issue where background color and image color weren't the same

[dlamprey]

@marcbachmann i suggest you mark this issue resolved as the solution provided by @ThibaudREY works perfectly. And update your documentation accordingly. Now I love this package! 👍

[sarunmrzn]

@ThibaudREY only this worked for me

[latchy]

I actually managed to resovle this by passing in printBackground: true into the options object. From the docs.. "printBackground - Print background graphics. Defaults to false."

[htorohn]

Adding html { -webkit-print-color-adjust: exact; } in my css worked for me.

Thanks for this, the only solution that really worked for me!!