@media print not working with background and colors

Asked Feb 09 '16 at 07:55

Active Feb 09 '16 at 08:02

Viewed 100 times

I have my html and I want to the colors to be applied when I do print preview or print the page. But the problem is, it is not working. I also tried

@media print {
  tbody tr:nth-child(odd) {
  background: rgba(170, 184, 255, 0.4) !important;
  -webkit-print-color-adjust:  exact; 
 }
}

@media screen {
  tbody tr:nth-child(odd) {
  background: rgba(170, 184, 255, 0.4) !important;
  -webkit-print-color-adjust:  exact; 
 }
}

but it doesn't apply the colors on print preview. I read related questions like this but it wasn't helpful. What should I do to fix it.

For better understanding, I have the updated code in jsfiddle. https://jsfiddle.net/8v4gn4Lu/

edited May 23 '17 at 11:59

Community

asked Feb 09 '16 at 07:55

Sumit Sahay

What browser are you using? I assume chrome? – Ben Rondeau Feb 09 '16 at 08:00
yes, but that problem is in all browsers, like chromium, firefox – Sumit Sahay Feb 09 '16 at 08:03

@media print not working with background and colors

0 Answers0