当サイトの印刷対応
トピックス
当サイトをブラウザから印刷できるようページの印刷対応をしてみました。
多少のズレなんかはあると思いますが、印刷して見れる程度にはなっていると思うので、その点ご了承ください。
[対応ブラウザ]
Internet Explorer8・9とFirefoxの対応をしてみました。
Chromeは、”背景を印刷する”機能がないため対応外です。
Safariは、”Windows版Safariが印刷対応されていない”ので未確認です。
[Internet Explorer9のバグ]
Internet Explorer9は、”3カラムレイアウトにすると、中央のコンテンツが長い場合(同一コンテンツを複数リピート表示したような場合)、中央のコンテンツがカラム落ちし、2ページ目以降に表示される”というバグがあるようです。そこはちょっと苦労しました…。
当サイトでいうとTOPページですね。
[Firefoxのバグ]
Firefoxは、”2~3カラムレイアウトでページが長い場合(印刷枚数が2枚以上になる場合)、フッターが2枚目の最上部に表示される”や”コンテンツの親要素にoverflor: auto;を使うと、間のページが表示されない”というバグがある様子。
これは、親要素に”display:table”、その中のfloatをかけている要素に”display:table-cell;”と”float:none;”を適応することで回避できます。
まぁ、バグというよりは、「media=”screen”とmedia=”print”でCSSを同じように解釈するには無理がある?それも複数のブラウザで…」といったとこでしょうか。
また、当サイトの記事で、印刷対応について紹介してみたいと思います。
関連記事(※当記事と関連性が高いと思われる記事)
印刷対応サイト
2012/08/31Web制作で活用したいツール
2012/09/30CSSでテーブルタグ(table・th・tr・td)を扱いやすくする
2012/08/22CSS3のベンダープレフィックス
2012/03/03HTML5導入前に覚えておきたいこと
2011/12/22おすすめ書籍・商品(※当記事と関連性が高いと思われる書籍・商品)