Print用CSS

Posted by poundhound on

本日プリント用CSSをゴリゴリと書いていましたが、その時2つほど問題になった点があったのでメモ代わりに書いておきます。

まず一つはナビゲーションやバナーが表示されているサイドバー(div#secondary)をdisplay: noneで消しました。このサイドバーはdiv#secondaryで定義してあり、中にdiv.localNavが定義されています。その下にバナー群がpタグで定義されていますが、Firefoxのプリントプレビューではきちんとサイドバーが消えてくれるのですが、IE6では何故かバナー群が消えてくれません。なのでdiv#secondaryの子要素を消すためにユニバーサルセレクタを使いました。

div#secondary * { display: none; }

こいつでIE6でもサイドバーが非表示になってくれました。

次に問題になったのがdivごとに改ページされてしまったのです。メインコンテンツ部はdiv.sectionで各ブロックを定義してあり、簡易clearfixとしてoverflow: hiddenを記述していたのですが、こいつが悪さをしていた模様です。なのでoverflow: visibleで上書きしました。

div.section { overflow: visible; }

これで印刷用CSSで奇麗に印刷出来るようになりました

Categories: CSS Tags: ,

Comment(0) | Trackback(0)

Category:CSS の最近の記事

Trackback(0)

Trackback URL: http://www.nk0206.com/mt5/mt-tb.cgi/406

Leve comment

About Author

poundhound

poundhound
web-designer
  • del.icio.us
  • flickr
  • Last FM
  • tumblr

twitter

Recent Tweet

    follow me on twitter

    Life Log

    • twilog
    • twitpic
    • pick