質問: cssのfloatでレイアウトしたページの印刷について cssのfloatでレイアウトしたページを印刷してみると、 2ページ分必要なところが1ページ分しか印刷されなかったり、2ページ目が印刷されていても、ある一箇所だけ・・・ といった、印刷した時のレイアウトの崩れで悩んでいます。 ページ内のコンテンツ部分だけを印刷したいのではなく、あくまでも全体がきちんと印刷されるようにしたいのですが、 float:none; を設定すると、floatが解除されてしまうので、印刷するとますますおかしくなってしまいます。。。 印刷用スタイルシートをどのように設定したら良いのか、皆様アドバイスをお願いします・・・!!
回答: スタイルシートの中に印刷専用のスタイルを追加できます。 最後の方に、 @media print{ } を追加して、この中に印刷時専用のスタイルの記述を 埋め込みます。 これ以前に同一タグの記述があっても、 後ろに書いた方が優先されますが、 @media printの中に書いてあれば印刷時だけ機能します。 たとえば下記urlは画面では800px幅なのでa4縦印刷では 横がハミ出てしまいますが、 上記の方法で680pxに変更され、広告もない状態で 印刷されます。 参考url:http://www.asahi-net.or.jp/~ef2o-inue/top01.html