Table row Background Color not showing when printing

Question

I am facing a problem background color in a tablerow.

<tr style="background-color:#999999">
        <td width="204"> <strong>Opinion</strong></td>
        <td width="62"> <strong>Action</strong></td>
        <td colspan="4"><strong>Ratings</strong></td>
        <td width="54"><strong>Outlook</strong></td>
        <td width="93"><strong>Rating Type</strong></td>
    </tr>

This code working fine

Here is Output

Problem

When I want to take print of this page. background-color of the row is not shown.

Can anyone please help me?

Possible Duplicate: http://stackoverflow.com/questions/14987496/background-color-not-showing-in-print-preview — ketan, Nov 30 '15 at 07:01

Saranya Rajendran · Accepted Answer · 2015-12-01T05:49:05.757

14

add this to tr style

 <style>
  .row{
   background-color:#999999;
   -webkit-print-color-adjust: exact; 
   }
 </style>

<tr class="row">
    <td width="204"> <strong>Opinion</strong></td>
    <td width="62"> <strong>Action</strong></td>
    <td colspan="4"><strong>Ratings</strong></td>
    <td width="54"><strong>Outlook</strong></td>
    <td width="93"><strong>Rating Type</strong></td>
</tr>

edited Dec 01 '15 at 05:49

answered Nov 30 '15 at 07:00

Saranya Rajendran

689
8
19

yes. i edited my answer. and its just fine. it working. – Saranya Rajendran Nov 30 '15 at 07:05
Nice answer @SaranyaR but use of inline CSS i not a good practice. – Ajay Makwana Dec 01 '15 at 05:45
I just added that to their existing code. thank you for your information. I'll keep it in mind.. – Saranya Rajendran Dec 01 '15 at 05:48

score 1 · Answer 2 · answered Nov 30 '15 at 07:01

Try using

<table> <thead> <tr> <th></th> </tr> </thead> <tbody> <tr> <td></td> </tr> </tbody> <table>

structure for table...

and use below type css..

@media print {
tr.vendorListHeading {
    background-color: #999999!important;
    -webkit-print-color-adjust: exact; 
}}

@media print {
    .vendorListHeading th {
    color: white !important;
}}

Hope this helps...

score 0 · Answer 3 · answered Jan 17 '17 at 04:28

0

You can also push more settings in the print dialog and check 'Background graphics'

answered Jan 17 '17 at 04:28

Andrey

44
1
11

Table row Background Color not showing when printing

3 Answers3