FONT FAMILY is not working in System Print

Question

My font family which is ARIAL NARROW is not working when i enable the browser print, when on screen it is good but its in print preview it will become TIMES NEW ROMAN .

Sample code, this style css is inside my dvContainer

<div id="dvContainer" class="dvContainer">
 <style type="text/css" media="all">
                            @page 
                              {
                                  size:  auto;   /* auto is the initial value */
                                  margin: 20mm 20mm 20mm 20mm;  /* this affects the margin in the printer settings */
                                  font-family: "Arial Narrow", Arial, sans-serif !important;
                              }

                              html
                              {
                                background-color: #FFFFFF; 
                                margin: 0px;  /* this affects the margin on the html before sending to printer */
                              }
                              .dvContainer p li ol { 
                                font-family: "Arial Narrow", Arial, sans-serif !important;
                                color: #000;
                                font-size: 9px !important;
                              }

                              table {
                                cellpadding: 1;
                              }
                              .pagebreak { page-break-before: always; } /* page-break-after works, as well */
                          </style>

Which will be called by this function:

$("#btnPrint").live("click", function () {
        var divContents = $("#dvContainer").html();
        var printWindow = window.open('', '', 'height=600,width=1000');
        printWindow.document.writeln('<!DOCTYPE html>');
        printWindow.document.writeln('<html><head><title></title>');
        printWindow.document.writeln('</head><body>');
        printWindow.document.writeln(divContents);
        printWindow.document.writeln('</body></html>');
        printWindow.document.close();
        printWindow.print();
    });

EXPECTED OUTPUT

OUTPUT FROM PRINT PREVIEW

Really need help

Answer 1

This way, you can provide different CSS style of the same elements for different media, such as "print" and "screen":

 @media print { body { font-size: 10pt } } @media screen { body { font-size: 13px } } @media screen, print { body { line-height: 1.2 } }

FONT FAMILY is not working in System Print

Question

1 answers

solution1
0 2019-12-04 06:29:20

FONT FAMILY is not working in System Print

Question

1 answers

solution1 0 2019-12-04 06:29:20

solution1
0 2019-12-04 06:29:20