JQuery Generated QRCode Disappears When Printing

Question

I have generated a QRCode using this Jquery Library.

$('#myid_info_barcode').qrcode();

The code above generates a qrcode canvas in myid_infor_barcode.

<div id="myid_info_barcode" class="myid_print_duo_barcode">
   <canvas width="256" height="256"></canvas>
</div>

When I printed it using window.print() and media print css using the CSS code below, the QR Code disappears in the print Preview.

@media print {
    .myid_print_duo_barcode
    {       
        margin: auto; 
        border: 1px solid black;   
    }
    .myid_print_duo_barcode > canvas{
        width: 98px !important;
        height: 100px !important;  
        border: 1px solid red; 
    }    
}

Where am I missing?