2014.03.06

ブラウザからウェブサイトを印刷するときはIEが一番使える

こんにちは(o’∀’)ノ

最近、少し暖かくていいですね!早く雪溶けてほしいっす。

 

 

さて、先日ホームページの印刷用CSSを書いていて気付いたことなんですが、ブラウザによっても印刷機能にも違いがあるんですねー。

わたしは大体スクリーンショット系の拡張機能で1ページまるごとキャプチャしてから印刷するなり、必要なとこだけ切り出してから印刷するので最近はあまり使ったことがなかったので知りませんでした。

意外だったのが、一番ダメだったのがGoogle Chromeで、
一番良かったのがIEだったこと!

普段、IEはウェブ制作には使いづらい厄介者と敬遠して使っていないので、どうせ印刷機能も一番ダメな奴はこいつだろうと思っていました。

先に謝る、ごめん、IE。

 

 

まず一番ダメだったGoogle Chrome。

普段愛用してるので、一番最初の確認作業もChromeでやってました。お前なら不具合なんておこらないだろ、おーヨシヨシと。

そしたら、CSS3で指定した『linear-gradient(グラデーション)』『border-radius(角丸)』『Flash』が正常に表示されない。

グラデーションは変な黒いボーダーが表示される箇所があり、角丸は角丸部分の背景が黒く表示されるんですよ。Flashは空白になります。

Flashは印刷できないのはわかっていたので別によかったんですが、『linear-gradient(グラデーション)』『border-radius(角丸)』に関しては自分のCSSの設定ミスで他のブラウザもこうなのかと思ったら、IE、Firefox、Opera、Safariではなんのこっちゃない正常に表示されてました。

おまけにここであることに気付いたわけです。

 

IEだとFlashが印刷プレビューで表示されてる!!!!!

 

Chrome、Firefox、Opera、Safariは全滅なのに。Flashはどのブラウザも印刷できないとおもってました…。
『linear-gradient(グラデーション)』『border-radius(角丸)』に関してはCSSの設定というより、おそらくブラウザの問題です。

なので、ブラウザからそのままウェブサイトを印刷したい場合は、IEがおすすめですね。