![印刷用CSSの書き方(基本編):ADP](https://cdn-ak-scissors.b.st-hatena.com/image/square/e7d11a58aabb48f7061b47a9c8d26a0bfaf7b005/height=288;version=1;width=512/http%3A%2F%2Fadp.daa.jp%2Fwp-content%2Fuploads%2F2019%2F11%2F1.jpg)
FirefoxはおおむねきちんとしたCSS解釈をしてくれるのだが、印刷エンジンがかなり頑固だ。Fx2の頃からある問題のようだが、現象としては ・巨大なテーブルを印刷する際ページをまたいで印刷されない(次のページにまたがる部分は消える) ・position:relative;やoverflow:auto;の要素がページをまたいで印刷されない というもの。 (※テーブルを入れ子にしていても同様の症状が出るらしい) 巨大なテーブルのみの場合、テストデータを作ってみたが正常に印刷されたのでひょっとしたら報告の多くは後者なのかもしれない。(いちおうテーブルが印刷されない場合はheight:100%;をテーブルに指定するとよいとあったという記述をみつけた)一般的なリキッドデザインではテーブル要素はコンテンツの中にあることが多いからだ。 そのため、テーブル要素は自然と多くの親要素に囲まれたDOM的に深い
このブログのアクセス解析を見ると、キーワード「firefox 印刷」で検索してこのエントリに飛んでくる人がかなりいます。やっぱりみんな困っているんだなぁと。Firefoxの印刷はかなりやっかいで、完全FIXは無理かもしれないという結論に自分の中でも解決していたのですが、最近この方法をやっていて、普通に印刷できてます。 display:tableで印刷対応 まずは、普通にfloat:left left leftで左に詰めたレイアウト。 floatによる3カラムレイアウトのサンプル(印刷対応無) <div id="all"> <div id="header">header</div> <div id="body"> <div id="localNav">localNav</div> <div id="main">main</div> <div id="relatedNav">relatedNa
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く