• ご利用案内
  • 作品レシピ
  • トピックス
  • ショップ
  • 掲示板
  • リンク集

HOME > トピックスTop > 印刷をすると所々の文字が消える

トピックス

印刷をすると所々の文字が消える

「レシピの印刷ページからプリントをすると所々字が消え、印刷されない」
という報告を受けました。

プリントアウトをしていただいたのに、インクを無駄使いさせてしまい、申し訳ありません。
原因を追究しております・・・。
(メールでご返答させていただきました)

例えば、このリメイクふくさのレシピには、(レシピの下の方に印刷ページのリンクがあります)
ヘッダー・サイド等、余計な部分を除いたこちらの印刷ページを用意しています。
この印刷ページから 印刷をすると、作り方の文字が所々印刷されない。 何回か印刷しても同じ。
のようです。

同じような現象がおきている方がいましたら、
お使いのブラウザ(InternetExplorerやFirefox等)とそのバージョンを教えていただきたいと思います。
コメント欄、もしくはメールフォームでも結構です。
また、詳しくわかる方がいらっしゃいましたら、対処やヒントを教えていただけたら大変嬉しいです。

ブラウザのバグ、もしくは私のページのCSS等が原因かもしれません。
私以外の別のサイトでも、同じ現象が起きているなら、ブラウザが原因かもしれませんね。

私の方で、印刷テストを(Windowsパソコンにて)してみました。
Internet Explorer (ver.6)
Firefox
古いバージョンですが、どちらも文字欠けはなく、大丈夫でした。
他のバージョン及び、その他のブラウザ、Mac、ipad等のタブレット(スマホ含む)では未確認です。
ご丁寧にご返信いただいたところ、IE9のようで、古いパソコンからは大丈夫とのことでした。

同じような現象を調べてみたところ、
[教えて!goo] IE8でWEBページが印刷されないところがある
[Yahoo!知恵袋] ホームページが印刷できないので困っています
とありましたが、違うような?気がします。

サイトを始めたころには、想像もつかなかった、タブレットやスマホの進化・・・。
うまく表示できなかったり、ちょっとした問題もあります。
携帯サイト作成は諦めましたが、スマホには対応させたいなと思う、今日この頃であります。
いろいろ難しいし、わからないことだらけです・・・。

more

もしかしたら、短い文章は大丈夫で、改行なしの長い文章が右側で切れているのかも?と思い、
サイト表示の幅を640pxにしてみました。
調べたところ、「A4用紙・縦」で印刷される幅は、640pxぐらいが妥当のようです。
あとは、ブラウザの設定で、用紙に合わせて拡大/縮小する、余白の設定をする等して、
印刷プレビューで確認後、印刷してみてください。

【私的メモ】
body {width:640px;} を追加。
#headerArea form {margin: 0;} に変更。変更前は{margin: 0 10%;}

2013.05.25

サイト作りにも力を入れたいな。

>>> 今日作ったものランキング <<<

このページの先頭へ