divを印刷しても、上に空白がありますjQuery

Question

私は請求書アプリケーションを作成していますが、請求書を含むdivを印刷しようとしています。私は、請求書の内容を含むdiv以外のすべてのdivを非表示にし、そのdivを印刷するという考えがありました。

このよう：

// on click of print button hide all div's except invoice and then force print 
    $(document).ready(function() { 
     $(document).on('click', '.print_button', function() { 
     $('.print_invoice').css({width: '100%'}, {height: "100%"}); 
     $('.hide_this').hide(); 
     window.print(); 

     // return all hidden div's on invoice click 
     $('.print_invoice').click(function() { 
      $('.hide_this').show(); 
      $(this).css({width: '83.33333333%'},{height: '60%'}); 
     }); 
     }); 
    }); 

そして、それは印刷するとき、それは上部に大きな空白があることを除いて正常に動作し、それが2ページにフッターの一部を強制ことのため。

どのように私は一番上にその大きな空白を削除し、それが1ページに収まるように、請求書を押し上げることができます。このよう

？

Answer 1

あなたは、印刷のために、専用のCSSスタイルシートを使用する必要があります。

あり

https://www.smashingmagazine.com/2011/11/how-to-set-up-a-print-style-sheet/

あなたがリセットのビットを行うことができます。

Rememeber：印刷時に印刷ヘッダーオプションを無効にすると便利です。