IE8で印刷が正常に行われない時の対処法(html5shiv.js)


IE8で印刷が正常に行われない場合の原因と対処を下記に記載します。
※HTML5で「html5shiv.js」を使用している場合

IE8の「背景の色とイメージを印刷する」にチェックが入っていない

出だしからHTML5とは無関係ですが、意外とこの設定を知らない方が多かったです。

IE8のツールバー「ファイル」→「ページ設定」→「背景の色とイメージを印刷する」にチェックが入っていないと、背景が印刷されませんので、チェックを入れてください。

 html5shiv.jsが印刷対応版ではない

html5shiv.jsには、web版と印刷対応版があります。
印刷対応が必要な場合は「html5shiv-printshiv.js」を使用して下さい。

CSSでbackgroundを指定する際、セレクタにHTML5で追加されたタグを指定している

「html5shiv-printshiv.js」を使用していても「web上では問題なく表示されるが、印刷時に表示されない」場合があります。

article h1{ background: url(...); }

のように、backgroundプロパティを指定しているセレクタがHTML5タグだと、正常に表示されないことがありますので、HTML5タグ以外の要素をセレクタとして使用するようにしてください。

floatの解除方法に"overflow:hidden;"を使っている

overflow:hidden;は印刷時に正常に表示されない場合があります。floatを使用している場合は、clearfix等を使うようにしてください。

適切ではない箇所に"position:relative;"を使っている

position:relative;を指定している場合、レイアウトによっては、正常に反映されないことがあるようです。
不要な指定は削除するか、print:cssを使って印刷用にレイアウトを調整してください。